This project is designed for you to gauge whether you want to apply to the Bootcamp or Industry branch. Follow the steps below to finish and submit your project. Do not be discouraged if you get stuck. Completing all tasks for the branch you are applying to is highly preferred, but we will only assess your project based on whatever you submit to us.
If you have any questions, please reach out to us at our email: webatberkeley@gmail.com
There are two Figma pages in the link below ("Bootcamp" and "Industry" -- access them in the top left). Please make sure you click on the project you are completing to see all of what you will complete.
- IMPORTANT: the Gradescope entry code is
EJRZ4G, please use that!
Our client is the annual Husband Calling Contest, and we will be building their website. Their description is as follows:
With over 40 years of illustrious history, the annual Husband Calling contest at the Iowa State Fair has always been an entertaining feat. Its popularity, though, is unfortunately on decline. We’d like to change that. We want to make our event feel younger and more vibrant than ever. And the process starts by launching a new central hub for all event related information.
There will be no skeleton provided for this project since you are able to use any React framework/library you want. We would prefer if you completed it in Next.JS (but will not mark you down if you use something else). You are welcome to use NPM or Yarn when downloading dependencies.
Use the documentation below to complete your project.
- Figma Designs: https://www.figma.com/file/rIbUHgPr25ieJv5mC7AXfu/%5BFA-23%5D-Frontend-Technical-Project?type=design&node-id=0%3A1&mode=design&t=1NMKGoid574qrhQj-1
- Next.js (optional): https://nextjs.org/
- Chakra UI (optional): https://chakra-ui.com/
Complete the navbar component. Clicking the icon or text in the top left should take you back to the home page, clicking "About" should take you to the About Us page, and clicking "Contestants" should take you to the contestants page.
Note: If you are completing the Bootcamp technical project, there is no need to build the contestants page. Feel free to link "Contestants" back to the homepage.
Complete the Landing page UI in the home page of your project. Make sure to follow the Figma provided.
Complete the About page. In the Figma, event times are given in Pacific Standard Time (PST). Implement the "Convert to EST" button so that when it is clicked, all event times are now given in Eastern Standard Time (add 3 hours, switch from AM to PM if necessary). Times should use the 12 hour clock, not the 24 hour (military) clock.
Complete all of the bootcamp tasks before moving forward.
Complete the Contestants page. This page displays all of the contestants with an option to "vote" for each of the contestants. When the "Vote" button for a contestant is pressed, the number of votes displayed next to the button should increase by one. Users should be able to vote for any contestant an unlimited number of times.
Congratulations! To submit your project, please make sure your project is in a GitHub repo that is set to private. You will be submitting your code on Gradescope. If you do not have a Gradescope account, please create one. If you are unable to create one, please email us
immediately. The Gradescope course code is EJRZ4G. You will see two different assignments: Frontend Project and Backend Project. Please only submit to Frontend Technical Project. You can ignore Backend Technical Project.
The technical project will be due by Tuesday, 9/5 at 10:00 AM PST. We will be unable to respond to clarification emails sent in after then. If you have any questions about the project, please let us know before then by email. Also reach out if you have any issues with the Gradescope submission (note that there is no autograder for this project so we will be reviewing your code manually).
Please be ready to run your web app locally for the technical interview! This means being able to view your web app in a browser and interact with it.
Also, this page may potentially update if we get some frequently asked questions, so keep this repository bookmarked and check back on it every now and then! If there are any major changes, we'll make sure to email you about those.