Mô tả

Next.js is a framework for creating React applications that comes with a page-based routing system, server-side rendering, static optimization with data-fetching, automatic code-splitting, client-side routing with page prefetching, built-in CSS (and SASS) support and API routes.

Next.js is based on React, webpack and babel. It is an awesome tool for creating web application and famous for server-side rendering. Next.js was built by Zeit.

While React is awesome, Next.js takes it a step further with better SEO owing to its Server Side Rendering feature. Next.js is a fast-growing React framework that is currently in use on over 110,000 repositories on github.

Next.js has a wide set of features that most tech enthusiasts and companies love;

  • Hot Code Reloading: It automatically reloads the application when changes in the code get saved.

  • Automatic Code Splitting: By this feature, every import in the code get bundled and served with each page. It means that unnecessary code never get loaded into the page.

  • Ecosystem Compatibility: Compatible with JavaScript, Node and react.

  • Server Rendering: Easily render react component on server before sending HTML to client.

  • Styled-JSX: Styled-JSX allows you to write CSS directly inside JavaScript code.

This Course covers the basics of setting up your Next.js app and configuring it for Redux, MongoDB, Bootstrap 4 and LESS styling, from there we will go over some implementations of these key features, the aim is to give you a solid understanding of what can be accomplished and how you can accomplish it.

We will also take into account some best practices when it comes to file structuring

This Course is For You If....

  • You want to be able to create web applications and web servers in one of the more common modern ways

  • You still don't see the big picture when it comes to web development

  • You want to fast track your way into becoming a Full stack web developer

Bạn sẽ học được gì

How to build a Server-Side Rendered React app with Next JS

How to use Redux in Next JS

How to Create a React app with better SEO Performance

How to Use Next with Styling assets like CSS, LESS...

How to Create a Full Stack Next app with its own Back-End Server

How to Use Bootstrap in Next JS

Yêu cầu

  • Basic JavaScript, HTML, and CSS Understanding

Nội dung khoá học

7 sections

Introduction

5 lectures
Introduction
03:04
JavaScript Variables
03:09
Arrays & Objects
02:58
Array Methods
03:42
Functions & Classes
03:50

Basics

5 lectures
Next App Setup
05:13
Adding Support for Web Assets
05:10
Routing
04:46
Connecting to Git with SSH
01:13
Pushing to Git
02:11

Redux & State

5 lectures
Redux Set-up
05:28
Redux Configuration
04:17
Redux Configuration II
03:40
React Dev Tools Installation
01:45
Using Redux
06:24

Next API & MongoDB

8 lectures
Intro to Node/Express
02:22
ES5 JavaScript
01:31
API Setup
03:57
API Setup II
05:00
API Methods
02:57
Connecting to Mongo DB
05:56
Our Mongo Connect Code
02:22
Adding Entries to our Database
04:49

User Authentication && Bootstrap

13 lectures
Adding Bootstrap 4
06:34
Responsive Navbar
06:33
Server Register Endpoint
12:22
Server Log In Endpoint
05:37
UI Register Form
08:27
UI Log In Form
03:12
Add Redux Thunk to Redux
02:51
Implement Redux Sign Up I
05:53
Implement Redux Sign Up II
10:57
Implement Redux Sign Up III
03:15
Redux Sign In
04:27
Persist User Data & Show Errors
08:54
Add Next Environment Variables
01:37

App 1: Cool To-do App

12 lectures
Create Todo Endpoint
12:32
GET Todos Endpoint
02:42
UPDATE Todo Endpoint
03:30
DELETE Todo Endpoint
05:45
Refactor Some Codes
05:14
Redux Action: READ Todos
07:12
Redux Actions: CREATE, UPDATE & DELETE Todo
03:15
Display All Todos UI
04:35
CREATE Todo UI
07:55
DELETE & UPDATE Todos UI
08:29
FIX Redux Legacy Code Warning
04:51
Optimizing Our Next Config
05:28

Deployment

2 lectures
Deploying to Heroku
06:23
Deploying to Vercel
03:45

Đánh giá của học viên

Chưa có đánh giá
Course Rating
5
0%
4
0%
3
0%
2
0%
1
0%

Bình luận khách hàng

Viết Bình Luận

Bạn đánh giá khoá học này thế nào?

image

Đăng ký get khoá học Udemy - Unica - Gitiho giá chỉ 50k!

Get khoá học giá rẻ ngay trước khi bị fix.