MERN STACK 2022 - Build Ultimate CMS (WordPress Clone)
Learn to build FullStack JavaScript Web Apps using MERN (MongoDB ExpressJs ReactJs NodeJS) Stack If you love learning new skills and building real world apps without spending years learning the basics then this course is for you. This course focuses on practical aspect of building FullStack apps. No matter how good your understanding is of any language or framework, until you have hands on practical experience, you will get completely lost when you have to actually build an app from the ground up.
More
Being able to code your thoughts and ideas and producing something real that can be used by millions of people around the world is a fascinating thing. With this course, you will be able to do just that.
We all know WordPress is the most popular and most used CMS (Content Management System) in the world. However most of the time you need to customize WordPress sites using different themes plugins and modifying the codebase. That means even though, it's really easy to get started with WordPress, you will spend a lot more time money and resources to scale and customize your WordPress site.
That's why I have decided to build a WordPress clone of my own. When you learn to build such massive CMS on your own from scratch, not only you understand how things work under the hood, you will also gain massive experience on building FullStack apps.
Using same programming language (JavaScript) in both backend and frontend is another attraction of using MERN stack for your next project.
With this course, you will learn to build fast, responsive sites using JavaScript (ReactJs NodeJs) from scratch and push all the boundaries of FullStack web development.
By the end of this course, you will not only become a master of MERN stack, you will also have a real world CMS running in the cloud, ready for millions of users around the world to use. Are you excited? Join me in this course and experience the joy of coding an awesome CMS of your own from ground zero.
Watch Online MERN STACK 2022 - Build Ultimate CMS (WordPress Clone)
| # | Title | Duration |
|---|---|---|
| 1 | Project demo | 06:16 |
| 2 | Project demo (dashboard) | 12:33 |
| 3 | Are you ready for this course? | 02:57 |
| 4 | Code editor | 04:43 |
| 5 | Using live demo as a guide | 04:45 |
| 6 | Initialize a project using npm | 06:44 |
| 7 | React NextJs project setup | 07:53 |
| 8 | Ant design and custom app component | 11:05 |
| 9 | Trying ant component | 06:23 |
| 10 | Global context (theory) | 06:36 |
| 11 | React hooks | 11:41 |
| 12 | Accessing context | 12:51 |
| 13 | Toggle theme context | 12:18 |
| 14 | Static folder for storing CSS files | 05:52 |
| 15 | Menu component | 12:03 |
| 16 | Next link to navigate between components | 13:14 |
| 17 | Layout component | 13:55 |
| 18 | Class to functional component (sidebar) | 10:28 |
| 19 | Admin menu | 15:22 |
| 20 | Menu icons | 08:37 |
| 21 | Set current url | 13:10 |
| 22 | Set active link | 11:20 |
| 23 | Auto collapse menu based on window width | 10:02 |
| 24 | Ant design form (theory) | 10:13 |
| 25 | Understanding grid and columns | 05:00 |
| 26 | Signup form | 13:18 |
| 27 | Signin form | 05:24 |
| 28 | Generate auth server | 09:18 |
| 29 | Understanding server and GET request | 11:49 |
| 30 | Understanding server and POST request | 07:06 |
| 31 | Signup to mongo atlas | 12:34 |
| 32 | Signup to sendgrid | 08:27 |
| 33 | Axios POST request and debugging | 16:24 |
| 34 | Save user in database | 13:27 |
| 35 | Toast notifications and loading | 14:20 |
| 36 | Auth context | 16:20 |
| 37 | Using context and local storage | 14:30 |
| 38 | Env file and axios configuration | 10:48 |
| 39 | Signin backend | 11:33 |
| 40 | Signin frontend | 07:37 |
| 41 | Signout | 10:59 |
| 42 | Conditional rendering and reset fields | 13:01 |
| 43 | How forgot password works (theory) | 04:19 |
| 44 | Forgot password request | 11:01 |
| 45 | Forgot password resposne | 09:37 |
| 46 | Implement reset password | 12:11 |
| 47 | Trying reset password | 05:51 |
| 48 | Admin categories page | 07:36 |
| 49 | Category create form | 11:06 |
| 50 | Category schema | 11:32 |
| 51 | Category route and controller function | 14:00 |
| 52 | Middleware explained | 07:05 |
| 53 | Request headers | 09:59 |
| 54 | Require signin middleware | 12:58 |
| 55 | Create category | 07:31 |
| 56 | Is admin middleware | 12:47 |
| 57 | Role based redirect | 12:53 |
| 58 | Protecting admin pages | 09:13 |
| 59 | Loading state | 08:50 |
| 60 | Current admin endpoint | 16:46 |
| 61 | Protecting page based on server response | 10:38 |
| 62 | Categories list server | 09:41 |
| 63 | List of categories client | 10:32 |
| 64 | Ant columns layout | 09:33 |
| 65 | Delete category | 09:39 |
| 66 | Update category server | 06:42 |
| 67 | Using modal component | 09:06 |
| 68 | Updating category on modal | 13:47 |
| 69 | Complete category update | 09:39 |
| 70 | Editor preview and posts page | 13:52 |
| 71 | Installing rich markdown editor | 09:05 |
| 72 | Styling editor | 15:08 |
| 73 | Post title and content in local storage | 15:52 |
| 74 | Load categories | 06:24 |
| 75 | Multiple select | 07:42 |
| 76 | Rich text editor upload image | 04:15 |
| 77 | React image resize and resolve editor issues | 15:34 |
| 78 | Using cloudinary | 09:38 |
| 79 | Uploading image | 14:27 |
| 80 | Post preview | 13:59 |
| 81 | Handle publish | 08:10 |
| 82 | Post route and schema | 10:11 |
| 83 | Save post in database | 15:47 |
| 84 | All posts server | 07:03 |
| 85 | Creating posts | 12:27 |
| 86 | List posts client | 14:30 |
| 87 | Why we need post context (theory) | 05:03 |
| 88 | Lifting state of posts | 11:37 |
| 89 | Lifting state of categories | 10:56 |
| 90 | WordPress inspired media library | 04:40 |
| 91 | Featured image modal | 08:21 |
| 92 | Media components | 08:08 |
| 93 | Upload component | 09:39 |
| 94 | Sending image as formdata | 12:48 |
| 95 | Save media in database | 12:35 |
| 96 | Drag and drop multiple images | 12:52 |
| 97 | Media context | 13:03 |
| 98 | Uploaded image preview | 08:28 |
| 99 | Create post with featured image | 08:16 |
| 100 | Media endpoints | 06:28 |
| 101 | Fetch media | 04:29 |
| 102 | Select from media library | 09:11 |
| 103 | Remove media | 09:56 |
| 104 | SEO in react apps and nextjs apps | 09:01 |
| 105 | Load all posts | 10:48 |
| 106 | Display posts | 13:17 |
| 107 | Single post page | 11:34 |
| 108 | Post image and meta content | 14:26 |
| 109 | Scrolling post view and responsive layout | 08:24 |
| 110 | Delete post | 07:16 |
| 111 | Post edit page | 16:19 |
| 112 | Pre populate post for edit | 15:18 |
| 113 | Post edit request client | 07:14 |
| 114 | Post edit server | 10:53 |
| 115 | Admin media upload | 12:40 |
| 116 | Admin media library | 03:45 |
| 117 | Create user by admin | 12:50 |
| 118 | Password generator select and checkbox | 12:48 |
| 119 | Create user by admin server | 15:49 |
| 120 | Send account info by email | 12:26 |
| 121 | Code refactoring new post | 10:33 |
| 122 | Code refactoring post list | 06:25 |
| 123 | Is admin middleware | 05:11 |
| 124 | Author nav and layout | 11:51 |
| 125 | Author post create page | 05:12 |
| 126 | Can create read update delete middleware | 17:26 |
| 127 | Apply new middleware | 08:58 |
| 128 | Author posts | 14:15 |
| 129 | Author post edit | 09:35 |
| 130 | Author media management | 18:03 |
| 131 | Subscriber nav layout and pages | 12:08 |
| 132 | Users page for admin | 08:19 |
| 133 | Users list for admin | 16:57 |
| 134 | Users list with number of posts | 12:38 |
| 135 | Delete user by admin | 08:36 |
| 136 | User update page for admin | 14:33 |
| 137 | User update form fields and media | 14:37 |
| 138 | Update user by admin | 17:52 |
| 139 | User image preview | 10:55 |
| 140 | Profile page | 13:07 |
| 141 | Author and subscriber profile page | 10:19 |
| 142 | Updating own profile based on roles | 17:34 |
| 143 | Post count and pagination server | 10:36 |
| 144 | Load more posts | 17:47 |
| 145 | All posts for admin | 09:55 |
| 146 | Searching and filtering | 08:29 |
| 147 | Creating comment server | 09:16 |
| 148 | Post comment form | 07:13 |
| 149 | Posting comment client | 15:37 |
| 150 | Populating post comments | 15:37 |
| 151 | Render list of comments | 08:19 |
| 152 | Can update delete comments server | 13:09 |
| 153 | Comments CRUD controller functions | 10:29 |
| 154 | Admin comments page | 10:55 |
| 155 | Rendering comments for admin | 10:45 |
| 156 | Load more comments | 10:58 |
| 157 | Comments description view and delete | 10:16 |
| 158 | Comments delete by admin | 04:05 |
| 159 | Comments page for users | 06:08 |
| 160 | Comment edit modal | 14:05 |
| 161 | Comment update | 14:00 |
| 162 | Contact page | 16:19 |
| 163 | Contact form submit | 05:06 |
| 164 | Send contact form email | 16:22 |
| 165 | Share post to social networks | 09:02 |
| 166 | Documents statistics server | 05:21 |
| 167 | Admin index page to display statistics | 08:13 |
| 168 | Numbers counter with progress | 12:44 |
| 169 | Custom hook useCategory | 11:33 |
| 170 | Custom hook useLatestPosts | 05:03 |
| 171 | Posts by category server | 06:41 |
| 172 | Posts by category page | 11:40 |
| 173 | List of posts based on category | 11:46 |
| 174 | Full width image | 11:09 |
| 175 | Loading to redirect | 06:44 |
| 176 | Text on top of full width image | 07:31 |
| 177 | Stats counter on home page | 09:29 |
| 178 | Latest posts in home page | 08:05 |
| 179 | Parallax image | 09:36 |
| 180 | Categories list in home page | 07:09 |
| 181 | Footer | 07:25 |
| 182 | Customize page | 10:10 |
| 183 | Customize home page from dashboard | 10:04 |
| 184 | Page create and fetch server | 13:45 |
| 185 | Customize home page | 14:33 |
| 186 | Custom hook useHome | 06:49 |
| 187 | Deployment overview | 03:32 |
| 188 | Digital ocean setup | 05:46 |
| 189 | SSH access | 08:56 |
| 190 | Push code to github | 05:37 |
| 191 | Installing NodeJs NGINX and git clone | 13:18 |
| 192 | Installing MongoDB and commit changes | 15:49 |
| 193 | Running frontend | 04:59 |
| 194 | Trying signup | 04:09 |
| 195 | Performing actions in dashboard | 12:03 |
| 196 | Final thoughts | 02:16 |
Similar courses to MERN STACK 2022 - Build Ultimate CMS (WordPress Clone)
Node with React: Fullstack Web Development
The Creative React and Redux Course
Working with React and Go (Golang)
AWS AppSync & Amplify with React & GraphQL - Complete Guide
Node.js, Express, MongoDB Bootcamp 2020 - with Real Projects
Make 20 React Apps
