Hello Hivers!
This is my second post in this series where I am documenting my progress while I build a fullstack website with the MERN stack.
If you haven't read my previous post(Building A FullStack Website With MERN #1), I highly recommend you do so in order to understand what I am trying to build here.
Let us pick up from where we left off.
The CheckList
- Set up the backend with NodeJs and Express ✔
- Set up the database with MongoDB Atlas ✔
- Set up the frontend with React and Reactstrap ✔
- Implement Redux for state management ✔ ★
- Connect the backend and frontend
- Deploy the website online
- Backend auth with JWT
- React and Redux auth state ( I don't even know what that is as of right now)
- Set up registration and login features
That little star denotes what I finished today.
In my previous post, I had talked about how I was stuck with Redux because I am new to redux and all the different things happening inside the various different files was very daunting in the beginning.
So, after my last post, I watched a ton of different videos on Redux and state management and after toiling for what felt like a lifetime, I can now say that:
I know absolutely nothing about Redux
Did not see that coming did you?
The thing is, working with Redux is not easy. The more I try to understand it, the more I seem to know even less of what the hell is going on!
Even so, after countless hours of reading the docs and watching different videos, I barely managed to implement it. The state of components now lies in a redux store instead of the component's native state.
The benefit with this transition is that now it is more convinient to manipulate the state or the data because now it is stored in a central location for all components to access.
Another change with the website is the input. Instead of using a prompt like before, it now uses a modal as you can see above which I implemented using ReactStrap which is kind of like the BootStrap framework but for React instead of HTML.
Before you become proud of me for all the greatness I have achieved in the last 2 days, please give me another chance to disappoint you for I am yet again stuck in another issue.
Issues
The more I code, the more it feels as if half of programming is googling stuff on the internet trying to find a fix for your issue and the other half is trying to understand why the program even works at all!
After I barely managed to wrap my finger around redux, I am now stuck at another issue.
After I add an item to the list, I can't add any more items. I know there must be a simple fix to this but I can't seem to find the solution.
After Redux took such a long time, I don't have enough energy to try to debug this code. The fact that it is 3AM as of now doesn't really help the case either.
This is it folks. Hope you enjoyed reading this. The next thing to do is to fix that issue I mentioned above and then it is ready to be connected to the backend.
All that will be in the next post, so stay tuned!
Happy hiving and stay safe.
P.S: Please checkout my web portfolio here and share your thoughts down in the comments below!