- Intermediate developer who want to go full stack and learn about routing, crud services, creating seo friendly pages and getting server side data rendered into their React app
- Creating pages in your React App (30 mins)
a.From components to pages and back again!
- Create dynamic pages (20 mins)
a.Create SEO friendly urls
b.Add an express server to your app
i.Basics of express
ii.How server side routing works with express
- Getting data flowing through your pages and components (20 mins)
a.Fetch data from an api using async/await
b.Render a list view from dynamic api data
c.Render a detail view from api data
- Adding CRUD to your app using API services (40 mins)
a.Use JSON server to quickly mock a REST service
b.Create an api service layer to interact with your resources
Rise Presents : React Codelab with next.js
Building a React app always feels like a complicated, unending and incomplete process. And that’s true for begin
Continue reading “React Codelab with next.js”
Next.js 2.0 comes packed with performance improvements and extensibility features
Continue reading “ZEIT – Next.js 2.0”
- /pages/index.js // Import React import React from ‘react’ // Export an anonymous arrow function // which returns the template export default () => (
This is just so easy!
- import React from ‘react’ import Head from ‘next/head’ import axios from ‘axios’; export default class extends React.
- Our index page does not implement this performance related feature in details page.
- /pages/details.js import React from ‘react’ // Import Link from next import Link from ‘next/link’ export default () => (
The term “universal” is a community-coined term for building web apps that render happily on a server. You might be familiar with “isomorphic” as…
Continue reading “React Universal with Next.js: Server-side React”
- Just create a few files for pages in your app, and you are done.
- For example, let’s say you need to create web app with two pages (Home page and About page).
- It uses the file system as the router for your app.
- You need to bring additional stuff which is needed for your app.
- import React from ‘react’ import Header from ‘.
There are too many JS frameworks out there — we all know that.