Talendar / nextjs-bootstrap-template

Template for a Next.js project that uses React-Bootstrap.

This is a template for a Next.js project that uses React-Bootstrap.

To use it, create your app using create-next-app:

npx create-next-app my-app-name --example https://github.com/Talendar/nextjs-bootstrap-template

Getting Started

To run the development server, use the command:

npm run dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying pages/index.js. The page auto-updates as you edit the file.

API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.js.

The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.

You can change Bootstrap's behaviour by modifying its Sass variables on styles/bootstrap.scss. All changes must be made before importing Bootstrap's SCSS.

Useful links

Here are some useful links:

• React.js Documentation - learn about React.js features and API.
• Next.js Documentation - learn about Next.js features and API.
• Bootstrap Examples - check out some examples of how to use Bootstrap 4.
• React-Bootstrap Examples - check out some examples of how to use React-Bootstrap.
• Bootstrap Sass variables - all the Sass variables of Bootstrap 4.

Note

You might see some deprecation warnings when the Sass code is first compiled to CSS - just ignore them. They should appear only once.

You might also see NPM complaining about unmet dependencies for Bootstrap (jQuery and Popper). You can also ignore those warnings, since you'll be using React-Bootstrap components.