Comments (4)
Hey, that is a good idea and something I have already considered but it might be a bit redundant. I agree that choosing between next.js vs plain react is a very important architectural choice. Most of the time I am also choosing next.js as the default option, however, I wanted to make bulletproof-react universal to react and not tie it to next.js specifics and that is the only reason CRA is being used here. Pretty much all of the concepts here can be implemented in a Next.js application with a couple of differences:
-
client-side vs SSR - some pieces of the code that rely on some browser APIs would not work on the server, so you would have to use https://nextjs.org/docs/advanced-features/dynamic-import with the
ssr
flag set tofalse
in order to start using it once it is in the browser. -
pages/routes - instead of handling them with react-router, you would keep all the code in features, e.g
src/features/pages/Discussion
and that page would be used insrc/pages/discussions/[discussionId].tsx
by just re-exporting everything. That way all the code related to the page would be kept in its belonging feature. -
authentication - there are multiple options how you do that:
- If you use API routes, you might want to check the next-auth package - https://next-auth.js.org/
- if you are authenticating against a custom server you might want to create your own auth wrapper. Also, consider using httpOnly cookies to store the token.
- you can read more about authentication here: https://leerob.io/blog/nextjs-authentication
-
Persistent layouts - https://adamwathan.me/2019/10/17/persistent-layout-patterns-in-nextjs/
-
This video shows a couple of useful tips and tricks specific to next.js: https://www.youtube.com/watch?v=R59e1Vl5lO8
Not sure if I missed something. I am curious about what @leerob thinks of this?
from bulletproof-react.
bulletproof-nextjs13 π
from bulletproof-react.
Auth and Layouts now have their own docs:
from bulletproof-react.
I've been seeing a fair amount of developer intent (in module/project discussions and the like) towards using react-static instead of Next.
Ah, React... where every aspect has a swag of valid options, and everything ends up opinionated!
(Un-opinionated modules just get consumed into opinionated builds/systems)
"Next vs Gatsby vs react-static" as a search would likely yield a plethora of conflicting opinions...
from bulletproof-react.
Related Issues (20)
- bulletproof-react with file-based routing HOT 6
- Could not start on the latest version of node
- STRUCTURE - Where to store static data? HOT 1
- Logout Functionality Not working Properly - DUC-3
- suggestion for pagination
- Network Error when sign up or loginοΌ HOT 2
- Question : How to make drawer globally? HOT 3
- Where must I put these files? [React, React Native] HOT 1
- Why we need to use number for createdAt in BaseEntity class HOT 3
- CRA is unmaintained HOT 3
- Avoid barrel files
- Update react-router usage
- [minor]: Typo in ~/README.md HOT 2
- Missing Link/Example in Global Store Management
- Some links are Not found HOT 1
- Auth flow does not work with new cookies
- Logo/Mascot idea :) HOT 1
- .env validation on build
- Not sure the Validation Example Code link is going to the right place HOT 1
- rimraf and glob are deprecated
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. πππ
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google β€οΈ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from bulletproof-react.