Well, I was trying to build projects and asked ChatGPT for project ideas from beginner to intermediate and it came up with a few nice projects, the one that caught my mind was making a blog app/site. Well seems pretty easy to me and I thought I could finish it in a week or few days. After making research on how I will build and implement some functionalities. I started on the fateful day, building my express backend first and connecting to my MongoDB cluster. I don't want to go into many details here, but I will mention few setbacks and how I solved them/never solved them.

I created a server on Port 5000, configured necessary middleware, created session and authentication with PassportJS , helper function to help with CRUD functionality and created routes to CRUD blogposts and comments. One of my first ordeal was passing comments to a particular blogpost which I solved by attaching the blogpost ID to the comment so when you make a comment to a blogpost the comment appears under the blogpost. Seems simple (simple una😒) tested it in Postman, it worked fine. Moved to authentication, created passport strategy for registering and logging in a user and functions to help with that, didn't work at first and took me a long time to be able to configure my sessions properly and adjust my middleware setup. I finally got it to work after a long day fighting bugs. The basic part is done I can create blogposts and add comments to a blogpost, and I can sign up and sign in users. I also created routes/functions to change password, reset password, logout etc.

I used NextJS for my frontend (where my pain started, I wished you can show people your app on Postman), it was my second time of using Next (first was a simple URL shortener that did not need much of Next shenanigans), I didn't understand the pages and routing system (thank goodness for NetNinja YouTube videos) and server components/client component wahala! I remember moving from vanilla JS to React, SPA looked crazy at first, but I enjoyed it, I wasn't even knee deep in react before I moved to NextJS (since its react but better features (they said) well, LFG!) I had trouble with linking and nesting routes and it took 2-3 days of reading docs and articles/videos to get some meaning from it. Well, I was moving at a snail's pace, learning and building at the same time. My biggest challenge was creating dynamic routes for blog pages, but I saw a video that explained it well and I went on to build pages/forms for my express routes, also building components like navbar, footer search bar, likes, etc. When creating search bar, I had issues with the API endpoint to fetch the data based on search query but thanks to chatgippity and stack overflow I got it going. Extracting the token from the URL when resetting a password also caused problems but I got the answer from maybe GitHub issues or Stack overflow to use UseSearchParams. Had many issues implementing functionalities in my app which I'm not going to say all but the biggest nightmare for me was implementing the delete user account in my next app, First of all, in post man to delete a user you type the endpoint with the user id attached to it and it deletes, the problem here is "how do I extract the id of the user and attach to the endpoint when making the delete request" tried everything from searchparams to Useparams, I even made the delete route a dynamic route but nothing worked, the simple project I planned for a week is getting close to 3 weeks(okay, dey play😂) at this point I just want it to work, all the other features I planned got thrown out the window, pls just work! I went back to my backend and after rewriting my routes and found out from copilot chat (better than gippity) that I was not supposed to use req.params to get object from route parameters (little wonder I was having Object errors in my server) I switched it to req.user_id to access id property of the user and changed few things in frontend and it worked. I went bezerk (like Man utd won the champions league) because that's the last thing I needed to do before deploying to production environment then I can work on the styling and responsiveness later but shege awaits...

NPM run build......build errors all over my routes which took me 2 days to fix except one that won't go away: error 401 unauthorized in Delete user page; prerendering error (I had authentication middleware to stop unauthorized users from making some request) but why is it making request in build time? (I'll never know) and besides it's not the only route that require auth so why is it the only one not working, left it came back after some few days, tried everything but nothing so after many trial and error I converted the fetch request to delete user (server component) to a client component 🏃‍♂️🏃‍♂️npm run build: success (or whatever). Another mini joy after suffering for days I pushed to Vercel, made the env changes and well app was deployed. Remember I did not test the function if it was working after I made the change to client component as long as my app builds I'm good. Later on, I was testing everything, and I tried to delete user, I got a hook error saying I used react hooks wrongly (Nah! you must be kidding me) I checked, and it was all good, but error says otherwise (it's not an important part anyway so why bother much). So I left it undone🤷‍♀️ After seeing much shege throughout the creation of the app, I finally finished the project and well here it is.

Thanks for Reading🙌