Upskilling to MERN web developer: Finished 2nd round of Roadmap to Learning Full Stack Web Development

Thought of sharing with interested persons that I have finished a second round of (my) Roadmap to Learning Full Stack Web Development Beginner Level through free online tutorials, https://ravisiyer.wordpress.com/2023/11/27/roadmap-fullstack-webdev/ [copy: https://raviswdev.blogspot.com/2024/01/roadmap-to-learning-full-stack-web.html ]. Note that the tutorials I used have been provided by others (Dave Gray and John Smilga tutorials are the major ones). I am now confident of developing simple to medium complexity web apps. using React (front end), Node Express, Mongoose & MongoDB (backend) with JavaScript as the common language. So I think I have now upskilled to a MERN web developer for simple to medium complexity apps.

For benefit of students and other learners who would like to go through the self-learning path that I followed, I have documented my journey in quite some detail. That documentation is currently available as a long notes-cum-log (linked to at the bottom of above roadmap) and I plan to reorganize it in the next few days.

The roadmap involves creation of quite a few tutorial projects including those having icons, images and some graphic effects (especially in CSS part of the tutorial). But the final stage of the roadmap involves writing a (frontend) React tutorial blog app that uses a Node Express, Mongoose and MongoDB backend API. I used the Dave Gray React blog tutorial code as the base with some changes/additions by me and wrote a new backend API for it where I used the John Smilga Node Express server tutorial code as a boilerplate. This blog app has a largely text interface with minimal icons and no other images. The emphasis is on implementing the CRUD (Create, Read, Update and Delete) functionality that the app. needs. Icons, images and graphics effect can be added to it, without too much difficulty, IMHO.

I have temporarily deployed this blog app. at https://ravisiyerblogfs.netlify.app/ . This app. runs on browser on mobile (tested on Chrome on Android) and PC (tested on Chrome on Windows). If you want to try it out, you are welcome. I have created a set of 10 posts as an initial data set. You are free to add, modify and delete posts.

The backend API server **optionally** uses HTTP Basic authentication for simple level of cloud data (MongoDB) protection. As of now, I have disabled authentication on the backend and so user credentials are not necessary to use the app.

The backend server is deployed on Cyclic.sh (free plan). As there is a limit of 1000 API requests per month for cyclic.sh free plan, it is possible that you may see a Network Error or Backend API not available message. As of now, I think the consumption is only around 100 APIs and so the backend API should continue to be available for the next few days.

BTW I have checked with an expert who has confirmed that there are no security risks on mobile or on other devices (tablet/PC) for viewing apps like the above simple app of mine, put up on netlify.com.

An important point about the app. is that students who follow the roadmap will be able to do something similar.

P.S.1: Later on I may enable authentication on backend server and if I do enable authentication on the backend server, the Netlify front end app on load will show a Set & Test User Credentials page. Please specify a valid username/password (you have to ask that from me) and click on 'Set & Test User Credentials'. You will get a "Backend API success! ..." message. Now click on "Posts" to go to home page (list of posts) and you should be able to see the list of posts on the cloud database. [Note that to keep it simple for student, I have chosen not to get into JSON Web Token (JWT) and storing the token on client (which will then remember the token across browser sessions), and providing for registration of new users.]

P.S.2: I have another local storage version of the simple Blog app. deployed here: https://ravisiyerblog.netlify.app/ . As it does not use a backend API, cyclic.sh free plan limit of 1000 APIs does not come into play, and so the app. should be available until netlify hosting free plan limit is reached. So far, I have not encountered that limit on netlify.