A fullstack web application utilizing frontend and backend technologies
Applying to jobs can be a game of numbers.
When applying to many jobs, it is difficult to track who you have talked to and where you are at in a company’s hiring process. Fortunately, "The Hunt" is here to help simplify that process and keep you organized.
This app allows a user to create mini place-cards for each company they are interested in or have applied to. They can then move the card by clicking and dragging it (using the HTML5 Drag and Drop API) to their desired position on the board. The user can also click the edit button (the small pencil in the left corner of each company's card) to view all the information they have gathered on a company. It is here that they can also change the position of a company on the board.
To use this application a user simply clicks on the "plus" sign on the top left portion of the screen. The user will then be prompted to fill out an html form that is nested inside of a modal. This form uses both frontend and backend validation to make sure the proper kinds of data are stored in the database. The user then will choose where they would like to place the company they are creating on the board. Delete functionality is also available. Simply click on the "X" in the top right corner of each company card and select "YES" on the confirm modal.
This web application is primarily single page and focuses on using Node.js, Handlebars.js, Expres.js, and MySQL to store and present user's data.
Our hope in creating this app is to provide job seekers the opportunity to have more control and better vision over their job application process.
Note: Below are three gifs to showcase the working project.
This project utilizes the following technologies:
- HTML -HTML5 Drag and Drop API
- CSS -CSS Variables
- Vanilla JavaScript
- jQuery
- Google Materialize
- Node.js
- AJAX
- Google Fonts
- handlebars.js
- Express.js
- Heroku
- MySQL Database
- Sequelize
- MVC Design Pattern
- Unit Testing
- Chai
- Mocha
Note: This section is meant for beginners an idea of what the crux technology was for this project. Ideally by seeing this first they will be able tackle the hard problem first to start the learning/absorption process as soon as possible.
The main challenges encountered with this project were primarily working with the HTML5 Drag and Drop API and with using Sequelize.
The Drag and Drop issues mainly required a lot of tinkering and manual testing. Most of our bugs were found when writing the logic. Sequelize issues stemmed mainly from getting used to proper model structure and making proper calls to the database. We did also run into the issue of non-boolean logic when using handlebars.js. This was solved by writing our own handlebars helpers functions to call upon.
Use the links listed below to learn more about the technology and remember you will eventually learn how everything works!
---Suggested Links---
- MySQL Data Types
- Sequelize Docs
- Handlebars.js Docs Docs
- [HTML5 Drag and Drop](https://developer.mozilla.org/en-US/docs/Web/API/HTML_Drag_and_Drop_API
Currently there are no known issues that need to be resolved. If you find an issue please submit it using the issues tab, or contact Nick Brown.
Below is a list of possible features that we would like to add to the project. If You would like to propose a feature to add please feel free to create a PR to add it to the list. We love it when others can help propose ideas!
- (.. if you would like to suggest an idea, insert it here..)
- Mobile Responsiveness
- User Authentication
- Google Maps API
- File Storage and Management
PS: If you would like to contribute please contact Nick Brown on GitHub or at n.brown.professional@gmail.com. We welcome bot first time contributors and experienced developers with critical feedback.