This is the complete source code compilation of all code listings in the book Pro MERN Stack, (2nd Edition), published by Apress. The book can be purchased at any of these websites:
The 2nd Edition has the following new things as compared to the original, first edition:
- It uses the latest React (React 16)
- It uses the React Router (React Router 4)
- It uses GraphQL rather than REST based APIs
- It adopts an architecture that lets you run the API and UI on different servers
- It includes deployment instructions on Heroku
- It uses other latest technology such as JWT and CORS.
- ... and many more improvements over the first edition.
Each section in the book ends with a working application, which corresponds to a branch in this repository. For each section, you can browse the complete source, or look at the differences from the previous section/step using the appropriate link against each section, in this page.
There is no discussion forum for this book, so if you do find any problems running the code, or even in the text of the book, do create New Issue in this github project. I or some other reader may help you resolve the issue.
There are no code listings in this chapter.
- Server-less Hello World: Full Source
- JSX: Full Source | Diffs
- Project Set Up: Full Source | Diffs
- Express: Full Source | Diffs
- Separate Script File: Full Source | Diffs
- JSX Transform: Full Source | Diffs
- Older Browser Support: Full Source | Diffs
- Automate: Full Source | Diffs
- React Classes: Full Source | Diffs
- Composing Components: Full Source | Diffs
- Passing Data Using Properties: Full Source | Diffs
- Passing Data Using Children: Full Source | Diffs
- Dynamic Composition: Full Source | Diffs
- Initial State: Full Source | Diffs
- Async State Initialization: Full Source | Diffs
- Updating State: Full Source | Diffs
- Lifting State Up: Full Source | Diffs
- Event Handling: Full Source | Diffs
- Stateless Components: Full Source | Diffs
- About API: Full Source | Diffs
- GraphQL Schema File: Full Source | Diffs
- List API: Full Source | Diffs
- Integrate List API: Full Source | Diffs
- Custom Scalar Types: Full Source | Diffs
- Create API: Full Source | Diffs
- Integrate Create API: Full Source | Diffs
- Query Variables: Full Source | Diffs
- Input Validations: Full Source | Diffs
- Displaying Errors: Full Source | Diffs
- MongoDB Basics: Full Source | Diffs
- MongoDB Crud Operations: Full Source | Diffs
- MongoDB Node.js Driver: Full Source | Diffs
- Schema Initialization: Full Source | Diffs
- Reading From MongoDB: Full Source | Diffs
- Writing To MongoDB: Full Source | Diffs
- UI Server: Full Source | Diffs
- Multiple Environments: Full Source | Diffs
- Proxy Based Architecture: Full Source | Diffs
- ESLint: Full Source | Diffs
- ESLint For Front End: Full Source | Diffs
- React Proptypes: Full Source | Diffs
- Backend Modules: Full Source | Diffs
- Front End Modules and Webpack: Full Source | Diffs
- Transform and Bundle: Full Source | Diffs
- Libraries Bundle: Full Source | Diffs
- Hot Module Replacement: Full Source | Diffs
- Debugging: Full Source | Diffs
- Simple Routing: Full Source | Diffs
- Route Parameters: Full Source | Diffs
- Query Parameters: Full Source | Diffs
- Links: Full Source | Diffs
- Programmatic Navigation: Full Source | Diffs
- Nested Routes: Full Source | Diffs
- Browser History Router: Full Source | Diffs
- Controlled Components: Full Source | Diffs
- Controlled Components in Forms: Full Source | Diffs
- More Filters: Full Source | Diffs
- Typed Inputs: Full Source | Diffs
- Edit Form: Full Source | Diffs
- Number Input: Full Source | Diffs
- Date Input: Full Source | Diffs
- Text Input: Full Source | Diffs
- Update API: Full Source | Diffs
- Updating an Issue: Full Source | Diffs
- Updating a Field: Full Source | Diffs
- Delete API: Full Source | Diffs
- Deleting an Issue: Full Source | Diffs
- Bootstrap Installation: Full Source | Diffs
- Buttons: Full Source | Diffs
- Navigation Bar: Full Source | Diffs
- Panels: Full Source | Diffs
- Tables: Full Source | Diffs
- Forms: Full Source | Diffs
- The Grid System: Full Source | Diffs
- Inline Forms: Full Source | Diffs
- Horizontal Forms: Full Source | Diffs
- Validation Alerts: Full Source | Diffs
- Toasts: Full Source | Diffs
- Modals: Full Source | Diffs
- New Directory Structure: Full Source | Diffs
- Basic Server Rendering: Full Source | Diffs
- Webpack for the Server: Full Source | Diffs
- HMR for the Server: Full Source | Diffs
- Server Router: Full Source | Diffs
- Hydrate: Full Source | Diffs
- Data from APIs: Full Source | Diffs
- Syncing Initial Data: Full Source | Diffs
- Common Data Fetcher: Full Source | Diffs
- Generated Routes: Full Source | Diffs
- Data Fetcher with Parameters: Full Source | Diffs
- Data Fetcher with Search: Full Source | Diffs
- Nested Components: Full Source | Diffs
- Redirects: Full Source | Diffs
- Higher Order Component for Toast: Full Source | Diffs
- MongoDB Aggregate: Full Source | Diffs
- Issue Counts API: Full Source | Diffs
- Report Page: Full Source | Diffs
- List API with Pagination: Full Source | Diffs
- Pagination UI: Full Source | Diffs
- Undo Delete API: Full Source | Diffs
- Undo Delete UI: Full Source | Diffs
- Text Index API: Full Source | Diffs
- Search Bar: Full Source | Diffs
- Sign-In UI: Full Source | Diffs
- Google Sign-In: Full Source | Diffs
- Verifying the Google Token: Full Source | Diffs
- JSON Web Tokens: Full Source | Diffs
- Signing Out: Full Source | Diffs
- Authorization: Full Source | Diffs
- Authorization-Aware UI: Full Source | Diffs
- React Context: Full Source | Diffs
- CORS with Credentials: Full Source | Diffs
- Server Rendering with Credentials: Full Source | Diffs
- Cookie Domain: Full Source | Diffs
- Git Repositories: Full Source | Diffs
- MongoDB: Full Source | Diffs
- Heroku: Full Source | Diffs
- The API Application: Full Source | Diffs
- The UI Application: Full Source | Diffs
- Proxy Mode: Full Source | Diffs
- Non-Proxy Mode: Full Source | Diffs
There are no code listings in this chapter.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent