Good vid! I wouldn't sweat on create-react-app and worry about routing so much! Only a handful boiler code? I'd still keep create-react-app. It's getting to too many frameworks and soon, they'll all blend and end up very similar. Great content, Mr Q!
Hi James, I've been reviewing the options you mention in the video. You did an amazing analysis and comparative here! I prefer NextJs, I think it covers more scenarios and they keep adding cool features. Looking forward to watch more videos about it. Thank you!
James - this is such great content. Thanks for putting this together. I been doing courses where they always use Reactjs and nodejs apart and then they integrate them to build the SSR. since I think i have the basics for/of Reactjs is time to look forward nextjs.
just completed next js basics mind blown completely and now that you've said it i'm not gonna use create-react-app anymore thanks for the informative video!
this video has just come at the right time for me! just starting out with React, so obviously going through the create-react-app run through like you said, but its great to see the breakdown of next and gatsby
Hi James ! Thank you for putting the time and effort into this detailed presentation ! This is high quality content! I do develop single page applications (not websites) using create react app at work. We develop testing software for payment systems. I find that for productivity apps, CRA seems suitable and sustainable ! I don't get whether or not we should consider SSR for some parts of the app, since we do not even have to (and better not) get our app contents indexed. Hence my question : are there other benefits to Gatsby and Next.js aside from search engines indexing? Should I reconsider our technological stack ? Best Regards, Chris
I would use CRA for prototyping something or any internal (enterprise?) system where you can just easily host and deploy somewhere and that's it. For all of the rest, I would go with Next.
Great video. I watched hours and hours of videos on RUclips before deciding to go to Next, but then I realized that I should've chosen gatsby. All I want to do is to create a blog and showcase my portfolio of websites and elearning content. Gatsby is better for this.
Great breakdown, James! I tend to start a new Gatsby app nowadays, even if I don't need static pages. I love the built-in routing and GraphQL support :) A question for you - can you elaborate on why you prefer Next.js's SSR over Gatsby's pulling in data from an API, in the email client example? If they're both essentially API calls, where does Next.js have the advantage? Is it about coupling the functionality in the one code base? Thanks!
In some ways, email client may not be the best example since a lot of it could be an API call. The difference is that Gatsby is dependent on an API call. Next has the ability "make the api call" before the page is loaded on the server. Next can provide server data as props to the react component where gatsby can't. The ability to mix SSR props and static props with Next just gives the ultimate flexibility
@@JamesQQuick gotcha! That does sound good actually. Presumably there'd also be some caching optimisation opportunities too? Looks like it's time to play with Next.js again. It's been a while...
Hmm I don’t know about caching on the server since they’re serverless functions and can’t guarantee they stick around for any period of time. The nextjs community points to swr for client side caching though
Unless you create a web app that does not need SEO and does need user login ( like twitter and facebook, every users monitor different data ) good choose you use Nextjs. When you choose a good headless CMS with it, it is really powerful.
@@JamesQQuick Just going through the setup for a NextJs project where you use both server side props and static props would be great. When I focus on development I dont like to spend my time setting up configuration I want to write frontend code. I think a video would be much easier to consume than reading the docs... I'm lazy...
@@matthewlefevre5667 Sounds like a good idea to me. The ability to mix SSR and static stuff is super powerful. Just gotta figure out exactly what the demo is!
Feels like is harder and harder for some one to learn front-end skill, decades ago you only need to know html and css to say I know how to make website.
I have went through the react docs section and read each page made 1 personal project for using create-react-app was wondering should i try gatsby or no? I consider myself still learning react. I just would like that automatic routes feature haha just don't want to throw myself in a new framework when react was a new framework like 5 days ago.
What would be the benefit of using Next JS vs CRA if your are building an app that is only accessible behind auth? You would not be using anything except maybe routing and image component. The other features would just be unused which is extra bloat. Honestly asking as I love the idea of Next but can't make a case for switching to it for Auth based apps with no public frontend accessible.
Well next gives you more flexibility with auth actually. You can do auth the exact same way you already do it and/or do server side auth as well for ssr. The new Auth0 nextjs library will have a mix of those two which I’m super excited about
Why vs vs vs? If you want custom, enterprise apps use cra. If you need ssr you can build your own express server or use nextjs and add some custom code to render the cra. If you want a framework for static content that has very good best practices use gatsbyjs. That is all. The video is quite confusing and by saying you kinda stopped using cra, i dont believe you. Why would you not use it?
That awkward moment when you realize that the overly complicated “solution” to your bugs was an oblivious attempt at re-inventing the wheel. *NextJS* : Am I a joke to you?
I have a couple questions about nextjs and if anyone with experience can answer them I would appreciated it. I know next js can be used for front end and back-end but what I don't understand is what's the benefits of using it for front end only with a django or php backend.
@@JamesQQuick Next is starting to sound like very opinionated like Angular 1. I wouldn't go with putting all my eggs in one basket. I would definitely do just the front end in Next and the back end in (for me its .Net6). It seems like Next is basically trying to create "Next Developers" that know nothing else except how next does things. Even hosting I have heard is difficult anywhere else if not Vercel. It could cause people to move to alternatives like Vue Nuxt.
You would never host a next app on godaddy. That’s a service you’d want to avoid at all costs really. You host next JS on vercel, it has certain hosting requirements because of server side functions
I'm going to be using Next.js going forward. Let me know what Next.js content you would like to see! 👇
Yes yes yes yes!!!!
@@a.bzr1 hmm that's a good idea but my friend James Perkins just did a whole course on that. I highly recommend it! gumroad.com/l/xltURi
@@a.bzr1 Great request. Coincidentally, my friend James Perkins just recorded a course just like that! You should check it out :) gumroad.com/l/xltURi
@Jack Saat I haven't done headless wordpress, but I've heard good things!
Would be great to see some Next.js projects with self contained APIs to do some simple backend work, including deployment.
Just when I thought I was being all cool using Create React App!!
Me too lol
@@DRocksRecords Me 3
Use snowpack 🤗
@@shkrmkr me too
CRA is awesome. Next JS is the next step and not a tough thing to learn when you’ve already been working with CRA
CRA is good for beginners to start learning React, Next js and Gatspy is the next step after learning React and building production apps.
Yep. Next and Gatsby earn much higher Lighthouse scores out of the box. They are the production level frameworks for react
Best Explanation on Gatsby vs NextJS. Period. Thanks brother. All the best for your next videos.
Thank you :)
Have you seen Next.js 10? Analytics, Commerce, built-in Image Optimization and more. Pretty cool stuff really
Hoping to get a video out on Image component next week :)
Great stuff. Been using Gatsby + CRA and this is now leading me to push towards Next.js on upcoming builds. Thanks.
Good vid! I wouldn't sweat on create-react-app and worry about routing so much! Only a handful boiler code? I'd still keep create-react-app. It's getting to too many frameworks and soon, they'll all blend and end up very similar. Great content, Mr Q!
Hi James, I've been reviewing the options you mention in the video.
You did an amazing analysis and comparative here!
I prefer NextJs, I think it covers more scenarios and they keep adding cool features.
Looking forward to watch more videos about it.
Thank you!
Glad you enjoyed it. I love nextjs myself!
James - this is such great content. Thanks for putting this together. I been doing courses where they always use Reactjs and nodejs apart and then they integrate them to build the SSR. since I think i have the basics for/of Reactjs is time to look forward nextjs.
I chose nextjs too and didn't regret my decision at all!
Yayy
I was waiting for this one badly! Thank you James
Yay!!
just completed next js basics mind blown completely and now that you've said it i'm not gonna use create-react-app anymore thanks for the informative video!
this video has just come at the right time for me! just starting out with React, so obviously going through the create-react-app run through like you said, but its great to see the breakdown of next and gatsby
Love it. Glad it helps :)
Hi James ! Thank you for putting the time and effort into this detailed presentation ! This is high quality content!
I do develop single page applications (not websites) using create react app at work. We develop testing software for payment systems. I find that for productivity apps, CRA seems suitable and sustainable ! I don't get whether or not we should consider SSR for some parts of the app, since we do not even have to (and better not) get our app contents indexed.
Hence my question : are there other benefits to Gatsby and Next.js aside from search engines indexing? Should I reconsider our technological stack ?
Best Regards,
Chris
I would use CRA for prototyping something or any internal (enterprise?) system where you can just easily host and deploy somewhere and that's it. For all of the rest, I would go with Next.
lol prototyping with CRA is basically building the app. You will work for ages on a prototype and wish you had used that time to build the actual app.
I used next.js and obviously react router, but I've never used Gatsby :D
Maybe someday I will use it for the games on my channel
Thanks for a hearth
Great video. I watched hours and hours of videos on RUclips before deciding to go to Next, but then I realized that I should've chosen gatsby. All I want to do is to create a blog and showcase my portfolio of websites and elearning content. Gatsby is better for this.
I think is still a great option. It’s gotten a lot better with staticcontsnt
thanks for the fairly detailed comparison. after using all 3 i still prefer the flexibility of create-react-app maybe im doing it wrong
I also prefer it, but thats because i like manual routing over the file routing, coming from an angular background 😂
Great breakdown, James! I tend to start a new Gatsby app nowadays, even if I don't need static pages. I love the built-in routing and GraphQL support :) A question for you - can you elaborate on why you prefer Next.js's SSR over Gatsby's pulling in data from an API, in the email client example? If they're both essentially API calls, where does Next.js have the advantage? Is it about coupling the functionality in the one code base? Thanks!
In some ways, email client may not be the best example since a lot of it could be an API call. The difference is that Gatsby is dependent on an API call. Next has the ability "make the api call" before the page is loaded on the server. Next can provide server data as props to the react component where gatsby can't. The ability to mix SSR props and static props with Next just gives the ultimate flexibility
@@JamesQQuick gotcha! That does sound good actually. Presumably there'd also be some caching optimisation opportunities too? Looks like it's time to play with Next.js again. It's been a while...
Hmm I don’t know about caching on the server since they’re serverless functions and can’t guarantee they stick around for any period of time. The nextjs community points to swr for client side caching though
Unless you create a web app that does not need SEO and does need user login ( like twitter and facebook, every users monitor different data ) good choose you use Nextjs. When you choose a good headless CMS with it, it is really powerful.
Thank you! Just what I needed to know.
Great video thks! I might go for nextjs since with cra, the react-helmet and react-snap are not doing the job i want for social media optimization.
I am new to Getsby and Next.js Thank you for your video
Hope it helped :)
I’ve converted to Gatsby where I can for my personal projects.
Super great video! Thanks for posting!
So glad you enjoyed it :) any nextjs content you would like to see in the future?
@@JamesQQuick Just going through the setup for a NextJs project where you use both server side props and static props would be great. When I focus on development I dont like to spend my time setting up configuration I want to write frontend code. I think a video would be much easier to consume than reading the docs... I'm lazy...
@@matthewlefevre5667 Sounds like a good idea to me. The ability to mix SSR and static stuff is super powerful. Just gotta figure out exactly what the demo is!
Very informative, thanks for explaining SSR vs CSR
Glad you thought so!
Great video, thanks! 🙂
I'm starting to feel like we are moving in Circles. 😂😂
We are back to what php offers. Yet we ditched it...
Hahaha it’s a little different but ya I get your point. I think now we’ve evolved to having options which is good!
We don't directly interact with dom in react that's the difference
Thanks James for the great insight !
Why do some jerks always dislike fantastic videos?
haha thanks for the support!
Appreciated
You Rock! You win a new sub!
Score!!! Thanks :)
Thanks man
Thanks for the video! - I would like to build a fullstack NextJs app that uses both SSR and Static Site generation.
Me too! That’s the beauty of it :)
great video James, i would like to see a full playlist for building a full-stack app with Next.js 😄
Great idea. In the backlog :)
Any suggestions for a specific type of app you’d like to see?
@@JamesQQuick maybe a Portfolio with several pages and a blog .
@@mehmetemin5404 That would be fun! My friend James Perkins just released a course on that. I highly recommend :) gumroad.com/l/xltURi
@@majdtaher7139 oooh I've thought about that but since I use Auth0 now, I'm less likely to build it all myself. Maybe Nodejs, React, and Auth0?
Great content, thanks. Subbed.
Yay!!
I'm confused, I thought Create React App is just a tool for creating project boilerplate.
It is, nextjs and gatsby takes that too another level by adding things like SSG or SSR and Fast refresh etc etc
Is there a big difference between Next Js and plain React? Is it difficult to learn if I already know React and some of its ecosystem?
If u dont use create-react-app, then use vue create 😅
Vue is definitely a fun option!
@@JamesQQuick I love vue but the fun part is I know react more than vue!
Add Nx to Next or NestJs and you have a winner.
Are we sure Google cant crawl client side rendered apps and read the headers etc? Has anyone done a test on CRA vs Next sites?
Feels like is harder and harder for some one to learn front-end skill, decades ago you only need to know html and css to say I know how to make website.
Next.js is still a valid option for a SaaS B2B product that will be deployed on premise and don't need SSR ?
I have went through the react docs section and read each page made 1 personal project for using create-react-app was wondering should i try gatsby or no? I consider myself still learning react. I just would like that automatic routes feature haha just don't want to throw myself in a new framework when react was a new framework like 5 days ago.
I would spend more time with react fundamentals and then explore other options :)
Next.js looks interesting
What would be the benefit of using Next JS vs CRA if your are building an app that is only accessible behind auth? You would not be using anything except maybe routing and image component. The other features would just be unused which is extra bloat. Honestly asking as I love the idea of Next but can't make a case for switching to it for Auth based apps with no public frontend accessible.
Well next gives you more flexibility with auth actually. You can do auth the exact same way you already do it and/or do server side auth as well for ssr. The new Auth0 nextjs library will have a mix of those two which I’m super excited about
Why vs vs vs? If you want custom, enterprise apps use cra. If you need ssr you can build your own express server or use nextjs and add some custom code to render the cra. If you want a framework for static content that has very good best practices use gatsbyjs. That is all. The video is quite confusing and by saying you kinda stopped using cra, i dont believe you. Why would you not use it?
You don’t have to believe me but I explained why I wouldn’t use it going forward. There’s nothing I miss out on by using next
@@JamesQQuick agreed
How about State Management?? Will that capability too gel well with next or Gatsby, please??
The cool thing is you can use the same state management tools you use with react in gatsby and next!
Excellent video but what about SPA web apps with React Router like functionality without any hacks?
What about them? I would still use nextjs lol
thanks
That awkward moment when you realize that the overly complicated “solution” to your bugs was an oblivious attempt at re-inventing the wheel.
*NextJS* : Am I a joke to you?
Hi James, can I use nextjs with redux toolkit?
I don't get how a blog is a static website?
Don't new posts get created?
I know right!!! Even content managed sites...surely that's the whole point of content management?
Will you create a Next.JS tutorial
Check my latest video :)
Why wouldn't you just go express+react?
All of the reasons explained in the video lol
Can you make a video about how to make create react app seo
Create react app is really not optimal for Seo. Something nextjs or gatsby makes more sense
I have a couple questions about nextjs and if anyone with experience can answer them I would appreciated it.
I know next js can be used for front end and back-end but what I don't understand is what's the benefits of using it for front end only with a django or php backend.
You most likely wouldn’t use nextjs for “just the front end”. The power of nextjs comes with a ability to add api routes via serverless functuons
@@JamesQQuick
Next is starting to sound like very opinionated like Angular 1.
I wouldn't go with putting all my eggs in one basket. I would definitely do just the front end in Next and the back end in (for me its .Net6).
It seems like Next is basically trying to create "Next Developers" that know nothing else except how next does things.
Even hosting I have heard is difficult anywhere else if not Vercel.
It could cause people to move to alternatives like Vue Nuxt.
I haven't used it since 2019.
Can you make video on next js app deployment on GoDaddy cpanel Or other shared hosting? Please thanks in advance
You would never host a next app on godaddy. That’s a service you’d want to avoid at all costs really.
You host next JS on vercel, it has certain hosting requirements because of server side functions
Server components on the way though
That gets interesting. So don’t fully understand them myself lol