A web app to gamify the job search!
View production site!
Back-end repo
·
Front-end repo
·
Project organization
·
- Project Overview
- Features
- Setup
- Technologies and Tools
- Challenges
- Wins
- ScreenShots and Demos
- Roadmap
- Credits
JobQuest is a text-based RPG-style campaign that aids in the job search process, while making it fun! A user can login or create an account to track their progress through different quests to defeat fantastical monsters. There are 3 types of quests: active, passive, and supportive. Active quests require you to perform actions such as apply for a job or send out a resume in order to conquer the beast. Passive quests will have you doing things like update your resume and research potential companies in order to triumph over evil. For supportive quests, you will be helping out friends (Guild-mates coming soon!) by completing such activities as host a mock interview for them or review their solution to a coding challenge. Once you complete an action outside the game, you will then select that option to deal damage to your demon. With each new quest level, the creatures you battle will become stronger, and therefore will be tougher to defeat. By completing every quest, you shall have taken the necessary steps to obtaining a job**. Good luck on your journey through JobQuest!
** Disclaimer: The creators of JobQuest do not in any way guarantee employment by completing this game, and thinking so is down right silly of you.
- User can login with an email and password
- Users can take on quests from three different types in any order they choose
- Users can choose what job search actions they want to complete to beat monsters
- Users can navigate through stylish 'pages' using custom tabs
- Users can track their progress with exp info and an quest log
- Download the repo using
git clone - Once you have cloned the repo, change into the directory and install the project dependencies. Run
npm installto install project dependencies. - Download and install the Back-end repo
- Run
npm startto view the development server (usually onlocalhost3000
- React
- React hooks
- TypeScript
- CSS/Sass
- Router
- JSX
- Cypress
- Auth0
- This was our first project using typescript. We had previously only used untyped languages. The more complicated the project became, the more careful we had to get with strict typing and variables. Ultimately it was a good experience, and building up modular 'type' objects turned out to be fun, despite the early frustration
- Continuous integration with TravisCI proved to be a big blocker for the front-end. We were hoping to get better practoce with it, but we ended up having to prioritise other things, making changes locally and manually deploying to heroku often.
- Our testing software, Cypress, gave us some trouble after our authentication feature was implemented, since the authentication process routed to another website, which broke some tests. We were able to get the tests back up and running after research, but it was a stressful bug.
- The planning process might have been our strongest point. The entire team brainstormed and planned and re-planned through the first several days of the project, making sure to build out wireframes and schemas, and not to leave anyone out. The idea for the app ended up getting almost completely re-worked near the end of the planning phases, and the extra effort up front helped us to make a better product in the end.
- This was the first project any of us had completed where our back-end was under development at the same time as the front end. We had to make sure that our communication was strong and clear, since often changes to one meant big changes for the other. There were lots of bugs at first, but we were able to communicate clearly and get everything fixed up, even through some discomfort
- We had a strong desire for the look of the app to be pixelated, but we still wanted to maintain a familiar, modern website structure. Because of this, we had to custom design a lot of the assets from scratch. The process of going from the wireframe to the actual production assets was tricky, and required a lot if trial and error, but the team was very collaborative, and we were able to focus in on only the most important parts of the site. In the end we made something beautiful and unique.
Details
Upon visiting the website for the first time, the user will be presented with a small message and a 'login' button. Clicking the login button will route the user to an Auth0 login screen. From this point on, when users visit the website, they will see the profile page, unless they click the 'logout' button on the profile page.
Details
On the profile page, the user can see a simple animated character avitar, which represents them for the game. The user can check their current Exp level, their email, and a logout button. The tabs on the right will allow them to navigate to the other pages.
Details
On the quests page, the user can choose what quest they want to embark on. There are three main 'types' of quests, active, passive, and supportive. THe user's more current progress in each types will be shown on the card. The quest types describe the type of actions the user will be required to complete in order to damage the monsters which block their way.
Details
On the active quest page, the user sees the monster they are facing. The monster's health is represented by hearts above the monster. Below the fight panel, the user can see two action cards. THe user needs to complete one of the two actions described on the cards in order to make progress against the monster. Once the user has completed the action, they click it, and the encounter is progressed. Once the monster's hearts reach zero, the user will see the 'victory' page. The quests exp is added to the user's current exp, and a log of the quest can be seen in the quest log tab.Future additions to include:
- Create Guilds where users can see and share their progress with other users
- Increase the detail of quest log to show the specific actions that a user has completed
- Add a 'proof' step to the encounter so a user must submit some form of evidence that the action was completed
- Create a Leaderboard where users and guilds can compete
- Add Chat functionality with other Users
These are the contributors with whom without their imagination, hardwork and dedication this project would not have happened. We are all really excited to talk more about our project with you! Feel free to reach out to us!
