An application where users can input their information to generate a CV/résumé. The purpose of this project is to practing developing with react state and props.
Project description can be found here
Live demo available via Netlify
- Real-time visualization
- collapsible form sections
- ability to toggle visibility of education, experience, and projects
- ability to print completed resume (or print to PDF)
- localStorage integration so the user can leave and come back without losing changes
- mobile friendly responsive styling
- HTML5
- CSS3
- React
- JSON
- Vite
This project helped to reinforce the following skills:
- React state and props
- JSON serialization
- localStorage integration
- responsive styling
This project could be improved with:
- A drag and drop feature to reorder sections, or entries within each section.
- dnd kit may be a good solution for this with multiple vertical containers.
- this project may be a good one to reference when implementing dnd kit
- styling to show content on second page when there is not enough room to fit everything on one page.
- This stackoverflow thread may be helpful for this.
- animations when expanding or collapsing form sections.
- run
npm run devto see changes during development
- This TOP lesson was helpful for initiating a new react project.
- Material Design Icons for SVG icons.
- Resume designed to match the popular Sheets & Giggles resime template from this Reddit post.
- uuid was unitilized for unique keys.
- Clone this repository to your desktop.
- Navigate to the top level of the directory by running
cd cv-builder. - Run
npm installto install the required dependencies. - Open http://localhost:5173/ in your browser.
- Run
npm run devto see your changes after each save.