Jul 12, 2023
Introduction:
In this blog post, I will share my experience of developing a job tracking web application using the MERN stack (MongoDB, Express.js, React, Node.js). The frontend of the application is deployed on Netlify, while the backend is deployed on Render. Over a span of four days, alongside my co-developer, we built a fancy todo-like web app that allows users to track the status of their job applications. The application consists of two sections: "In Progress" and "Accepted," enabling users to organize their job search process efficiently during times of unemployment or job transition. While the website is currently optimized for laptop use only, we have plans to enhance mobile compatibility in the future. Despite a few challenges along the way, our collaboration, the use of ChatGPT, and our newfound knowledge have made this journey rewarding and enlightening.
Tech Stack Selection:
Choosing the MERN stack as the foundation of our web application was a natural choice for us. MongoDB provided the flexibility and scalability needed to store and manage the job application data. Express.js allowed us to build a robust backend server, while React empowered us to create a dynamic and interactive frontend user interface. Finally, Node.js served as the runtime environment to execute our JavaScript code seamlessly. The combination of these technologies offered a powerful and efficient development environment, making the MERN stack an ideal choice for our project.
Collaboration and Workflow:
Collaboration played a vital role in the success of our project. We leveraged tools like GitHub for version control and project management. Regular video calls on Google Meet helped us discuss ideas, brainstorm solutions, and allocate tasks effectively. By dividing the workload and setting milestones, we ensured a smooth and organized development process. GitHub's merge conflicts resolution feature helped us streamline our collaboration, ensuring that our codebase remained clean and free of conflicts.
Challenges Faced:
During the development process, we encountered several challenges. One major hurdle was the implementation of CSS. We had to invest time in learning and experimenting with CSS techniques to achieve the desired visual appeal and user experience. Resolving merge conflicts was another challenge, especially when multiple team members were working on different features simultaneously. However, through effective communication and coordination, we managed to overcome these obstacles and maintain a cohesive codebase. Additionally, debugging and fixing bugs were an integral part of the development process, but they provided valuable learning opportunities.
Boosting Development with ChatGPT:
Throughout the project, we utilized ChatGPT, an AI language model, to enhance our development process. We interacted with ChatGPT to seek guidance on coding practices, troubleshoot issues, and brainstorm ideas for implementing new features. ChatGPT acted as a virtual mentor, providing valuable suggestions and insights that accelerated our development workflow.
New Learnings:
Developing this job tracking web app allowed us to gain confidence and proficiency in various technologies. We deepened our understanding of CSS, exploring different styling techniques and improving our UI design skills. Additionally, we honed our expertise in Express.js, JavaScript, and React, gaining a solid foundation in these technologies. The project served as a practical learning experience, allowing us to apply our knowledge and expand our skill set.
Future Plans:
While we are proud of the web app we have built, we have identified areas for improvement and have plans for its future development. One of our primary goals is to optimize the backend authentication process, reducing the login time, especially when the server has been inactive for an extended period. We also aim to enhance the overall performance of the application by optimizing database queries and improving server response times. Additionally, we plan to add more functionality, such as notifications, reminders, and the ability to track interview schedules. Furthermore, making the web app compatible with mobile devices by implementing responsive design and media queries is high on our agenda. Lastly, we aspire to refine the CSS styling further, ensuring a visually appealing and intuitive user interface.
Conclusion:
Building a job tracking web app using the MERN stack has been an exciting and rewarding experience. Collaborating with our co-developer, leveraging tools like GitHub and Google Meet, and receiving assistance from ChatGPT significantly contributed to the success of the project. Along the way, we encountered challenges, learned new skills, and gained confidence in CSS, Express.js, JavaScript, and React. As we look toward the future, we have a clear vision of how we can enhance the application's performance, add more features, and improve mobile compatibility. This project has not only allowed us to build a useful tool but has also expanded our knowledge and fueled our passion for web development.