Next.JS - the production ready react on steroids framework
source link: https://dev.to/atordvairn/nextjs-the-production-ready-react-on-steroids-framework-3mkj
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
Next.JS - the production ready react on steroids framework
Next JS is an amazing JavaScript framework made on the existing react framework made by Facebook. Factors that make it amazing or the SEO features. Also Next JS as an inbuilt support for API structures which make it even more amazing when working with APIs.
It has a ton of inbuilt modules which makes development even more amazing text to image module as an instance. It automatically optimises the images as per the weight and height and other factors. The link module enables no refresh routing which fetches the JavaScript code and renders that instead of redirecting you to another page.
It's called react on steroids because of all these inbuilt module sentence of features which come along with next.
Other frameworks like blitz.js are made on top of next.js, adding more functionalities to the framework. Next JS has a support for server side rendering which makes it incredibly faster than react and the content is available to web crawlers too.
Next v12 is now using rust compiler and is having 5x faster builds than before!
installation
To initialise a next.js application, run:
npx create-next-app@latest
# or
yarn create next-app
Enter fullscreen mode
Exit fullscreen mode
You can create a TypeScript project with the --ts, --typescript flag:
npx create-next-app@latest --ts
# or
yarn create next-app --typescript
Enter fullscreen mode
Exit fullscreen mode
file systems in next
now see the file structure carefully
The pages directory is the entry point of the application as well as the URL structure of your website.
That is, pages/about.js will be available at [url]/about
The public directory will contain your assets and other images for files which are not controlled by next.
You can create as many folders and can also access them.
Like, making component folder which will contain usable components which you can reuse in different pages without writing same code every time.
wrapping up
Next js is an amazing framework for creating beautiful applications with react which perform amazingly in search results and performant on the user's side.
It's evolving into other framework too like blitz.js which are having a bit of ruby like approach.
Anyways, next is a must try if you're a react developer!
originally published here at my blog
Make sure you're subscribed to the high dose javascript newsletter
of course I can't make you, but it take me a considerable amount of time to write these..
tweet this if you like it.
thanks!
Recommend
-
107
Toasty The usual Toast, but with steroids. Prerequisites Add this in your root build.gradle file (not your module build.gradle file): allprojects { repositories {...
-
121
visual-regexp-steroids visual-regexp-steroids is an extension to visual-regexp which enables the use of modern regexp engines (no more escaped group parentheses, and...
-
92
Privacy Possum is a new open source browser extension for the Mozilla Firefox and Google Chrome web browser by a former developer of the EFF's Privacy Badger extension.
-
42
:chart_with_upwards_trend: If you are mostly interested on the benchmarks between different GraphQL servers (Python, JS, Scala...
-
88
README.md Extended session management for Vim The vim-session plug-in improves upon Vim's built-in
-
71
In this post I'd like to introduce a serdebug helper which is a drop-in replacement for #[derive(Debug)] with some of the advanced featur...
-
6
Introduction This isn't going to be just another hooks and context tutorial, this is going to be me writing about how to do react hooks and state management like a pro. And, it can be a little too much to digest, so grab your...
-
12
RPReplay_Final1632419741.MP4This starter is a collection of libraries and approaches from my personal experience. No hard judgements ✌️ For more information, check out
-
7
Hello there, everyone! I'd be lying to all of you if I said that this Monday was a great start to my week! It was definitely on the rough side with personal/family issues getting in the way. However, I managed to commit to the...
-
7
11 1 1 1 2 Build a Pr...
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK