Shehzad Muhammad

I wanted to learn how to make a more impressive website than just a simple querying from an API. I decided to make a full stack MERN (Mongo, Express, React and NodeJs) application because I wanted to learn more server side code and I wanted this also added onto my familiarity with React. I was very satisfied in developing the backend server with an API as I was always intersted in that side of web development. I am a big fan of Zara and if you ask most of my friends they'll tell you right away it's my favourite brand so I decided I would make a mock zara site with my own API. In the site, you can view the items and add them to your shopping cart and check them out.

For this project I learned how to use NodeJS and Express to build my own API using Mongo Atlas and I was able to host the API on a server to access its data. I also discovered Postman which is a tool that makes API calls without the need for the front end. I could test out GET, POST and DELETE requests from the platform itself. Subsequently I learned how to connect the backend to React and access the data. I was introduced to Redux in this project for managing the states of my collected data. I learned how to make reducers and controllers and how to access them with axios. I also was able to create the shopping cart which is local data not data from the API.

After finishing this project and hosting it, I was very proud to have this as the first real project that I can demonstrate my skills in Web Development. This project also made me realise how much I enjoy making and learning about web projects.

The first personal project I completed using React is a Weather App. I wanted to understand how to query data from an API and display onto a website. I learned how to make calls from an API and use a form for querying the data. I used APIXU API because it is on a secure HTTPS instead of HTTP, I was able to query enough data for a 5 day forecast.

Once I started to learn NodeJS I came across Socket.IO which very easily showed me how to make a chat application. From there I tried to add my own components: creating a username and informing when othe users have joined. Sockiet.IO demonstrated a way how chat applications can be developed.

I wanted to make the forum site because in the Zara Site I was able to use GET requests to collect my data, however there wasn’t an option POST or DELETE requests. I made a forum site where you can ask a question and comment on other posts. I wanted to learn how to provide user authentication and login.

I learned how to do user authentication and login. I learned of conditional rendering so that only the user can delete their own posts and comments. Initially I had difficulty inserting comments for posts but after trial and error I was able to resolve the issue. I also learned how to get data from the URL, when you the specific post is requested the postsID is in the url and the QuestionPage component grabs that ID and uses it to access the data.

Finishing this site was my most rewarding experience due to there being many difficutlies that almost caused me to scrap the project entirely. I had diffculty in calling the api for the data in the forums based on how I created the data set. After some trial and error I was able to model the data in a way where I could call it successfully.

This was the first iteration of my personal site. I used ReactJS and I wanted to go with this style of each page being a card thats slide into the screen. Looking back for improvements I wanted to remove the fluff that was present in my old site. For future iterations I am aiming for a minimalist deisgn