This past weekend, I decided to make a little quick-starter for all my NextJS and Styled-components based projects.
It was a little annoying to bring up the docs for each tool to implement because I can never remember all the setup and configurations 😅
So, if you're a react dev tinkering with NextJS, you can use my starter to bootstrap your next app!
It has the bare minimum including a:
functioning Navbar, Mobile Nav, example component, react-icons library, and darkmode! That's it.
Please customize to your needing! If you understand React, basic CSS and :root variables, you'll find yourself editing and navigating through the files very easily. It also features the easiest Darkmode you've ever experienced!
As always, after cloning the repo, to get started simply run
npm install , and in the case of a NextJS app, you're going to run
npm run dev to start the development process.
That's it 💯
If your familiar with create-react-app, the
pages folder is like your
src folder. Inside you'll find the
index.js file, which is like your
App.js file in a create-react-app project. You'll also find
_app.js which is like your
index.js file in create-react-app.
That wraps up Your NextJS + Styled-Components + Darkmode quick-starter! I hope you can make use of this quick-starter. NextJS is seriously cool, styled-components makes CSS even more fun, and darkmode doesn't have to be such a drag with next-theme! Have fun!
Running into problems or have any questions!? Hit me up on Twitter!