CASE STUDY.
Career Harvest
PROJECT OVERVIEW
Career Harvest is a Digital Nest exclusive full-stack application designed to streamline job searching for interns and members by aggregating job listings from multiple sources, such as Indeed, LinkedIn, and ZipRecruiter. Developed by a team of six interns including myself, this project aims to aid the career services department in finding more relevant and better opportunities for job seekers. This innovative software scrapes the web for current job listings and consolidates them into a user-friendly interface where users can favorite jobs, view detailed descriptions, and apply directly through the job site’s application link.
OBJECTIVES
1. Aggregate Job Listings: Develop a web scraper to collect job listings from various sources and consolidate them into a single platform.
2. Create a User-Friendly Interface: Design and implement an intuitive front-end interface to display job listings, allowing users to favorite jobs and view detailed descriptions.
3. Facilitate Direct Applications: Ensure users can easily apply to jobs by linking directly to the job site’s application page.
4. Build a Robust Full-Stack Application: Utilize a modern tech stack, including TypeScript, React, Firebase, SASS, JavaScript, Node.js, and Docker, to ensure a scalable and maintainable application.
2. Create a User-Friendly Interface: Design and implement an intuitive front-end interface to display job listings, allowing users to favorite jobs and view detailed descriptions.
3. Facilitate Direct Applications: Ensure users can easily apply to jobs by linking directly to the job site’s application page.
4. Build a Robust Full-Stack Application: Utilize a modern tech stack, including TypeScript, React, Firebase, SASS, JavaScript, Node.js, and Docker, to ensure a scalable and maintainable application.
CHALLENGES
Web Scraping Integration: Ensuring the web scraper effectively collects data from various job listing sources without encountering significant issues.
Dynamic Component Design: Creating a dynamic listing component capable of displaying any number of job listings accurately.
User Favorites Implementation: Developing a user-friendly method for favoriting jobs and saving them for later access.
Effective Team Collaboration: Coordinating efforts among the team members across various locations to ensure seamless integration of front-end and back-end functionalities.
Styling Consistency: Maintaining a cohesive and visually appealing design across the entire application.
Dynamic Component Design: Creating a dynamic listing component capable of displaying any number of job listings accurately.
User Favorites Implementation: Developing a user-friendly method for favoriting jobs and saving them for later access.
Effective Team Collaboration: Coordinating efforts among the team members across various locations to ensure seamless integration of front-end and back-end functionalities.
Styling Consistency: Maintaining a cohesive and visually appealing design across the entire application.
MY ROLES.
LEAD FRONT-END DEVELOPER
As the lead front-end developer, I was responsible for overseeing and implementing the core functionalities, front-end design, components, and ensuring a seamless user experience.
TEAM COLLABORATION
I maintained regular communication with the backend team to ensure seamless data integration and efficient transfer of job listings to the front end. This collaboration was crucial in addressing challenges and ensuring the project’s success.
PROGRAMMING THE FRONT-END
Together with another intern, I led the design of the entire front-end using Figma, focusing on creating an intuitive and aesthetically pleasing interface that promotes a seamless user experience.
I contributed significantly to the front-end programming alongside two other interns, with my primary focus being the development of the listing component. This key component dynamically displays job listings, organizing them effectively and providing necessary details and application links.
Additionally, I was responsible for developing and implementing the login/logout functionality. This essential feature enables secure access for Digital Nest’s employees and members, facilitating smooth and secure user interactions within the software.
I contributed significantly to the front-end programming alongside two other interns, with my primary focus being the development of the listing component. This key component dynamically displays job listings, organizing them effectively and providing necessary details and application links.
Additionally, I was responsible for developing and implementing the login/logout functionality. This essential feature enables secure access for Digital Nest’s employees and members, facilitating smooth and secure user interactions within the software.
DEVELOPING THE LISTING COMPONENT
My main responsibility revolved around the development of the listing component, which is pivotal to the application’s functionality. This component serves as the interface through which job listings are presented to users. It dynamically fetches and displays job listings from the backend web-scraped data, ensuring that the data shown is always up-to-date and relevant.
The listing component is engineered to handle a variety of job postings seamlessly. Each listing is displayed with detailed job descriptions, facilitating a better understanding of the position at a glance. Additionally, direct application links are integrated within each listing, allowing users to conveniently find the direct job application.
Overall, the listing component is designed to improve the user experience by providing a clear, organized, and efficient way to access job information, thereby streamlining the job search and application process within the application.
The listing component is engineered to handle a variety of job postings seamlessly. Each listing is displayed with detailed job descriptions, facilitating a better understanding of the position at a glance. Additionally, direct application links are integrated within each listing, allowing users to conveniently find the direct job application.
Overall, the listing component is designed to improve the user experience by providing a clear, organized, and efficient way to access job information, thereby streamlining the job search and application process within the application.
STYLING THE FRONT-END
Another responsibility of mine was styling the majority of the front end which was styled using SASS, ensuring a cohesive, responsive, and modern design that aligns with the application’s purpose and user needs.
IMPLEMENTING THE FAVORITES FUNCTIONALITY AND FILTER FUNCTIONALITY
I developed a favorites star feature, allowing users to save jobs they are interested in and return to them easily. This feature enhances user engagement and provides a personalized job searching experience.
I added a filter functionality that enhances usability for the career services department. This feature allows them to manage job listings directly through a Google Sheet, ensuring that updates are immediately reflected on the front end. This integration streamlines the process of displaying current job opportunities, allowing for quick adjustments and targeted sharing based on specific needs.
I added a filter functionality that enhances usability for the career services department. This feature allows them to manage job listings directly through a Google Sheet, ensuring that updates are immediately reflected on the front end. This integration streamlines the process of displaying current job opportunities, allowing for quick adjustments and targeted sharing based on specific needs.
SOLUTIONS.
TECH STACK
Embracing a modern tech stack to build a scalable and maintainable application. TypeScript and React were used for the front end, Firebase for real-time data handling, SASS for styling, JavaScript for various functionalities, Node.js for server-side logic, and Docker for containerization and deployment.
COLLABORATIVE DESIGN PROCESS
Worked closely with another intern in Figma to design the front-end interface, ensuring that all design decisions were aligned with the overall vision of the project.
COMPONENT BASED ARCHITECTURE
Utilized React’s component-based architecture to build reusable and maintainable components, making the development process more efficient and the application more scalable.
EFFECTIVE DATA HANDLING
Worked with the backend team to design an efficient data handling process, ensuring that job listings were dynamically fetched and displayed properly without compromising performance or code readability. This allowed us to maintain a clean workflow throughout the development process
CONCLUSION.
Career Harvest is a testament to the collaborative efforts and technical skills of the team of interns at Digital Nest. As the lead front-end developer, I played a significant role in designing and developing the front end, styling the application, and ensuring effective integration with the backend. This project not only provided valuable experience in full-stack development but also demonstrated the potential for creating impactful software solutions that will be utilized by Digital Nest for years to come. The completion of the MVP marks a significant milestone, and ongoing development will continue to enhance and refine the application, ensuring it meets the evolving needs of the career services department and its users.
