Resume CV Builder is a powerful, user-friendly web application that allows users to create professional resumes quickly and easily. With a range of customization options and a live preview feature, users can craft the perfect resume tailored to their needs.
- User-friendly interface with tab-based navigation
- Real-time preview of the resume
- Multiple resume templates (Modern, Classic, Minimalist)
- Customizable font styles, sizes, and colors
- Adjustable background color
- Sections for Personal Information, Professional Summary, Work Experience, Education, and Skills
- Dynamic addition and removal of entries in various sections
- Form validation for critical fields
- Export options (Print, PNG, JPG)
To set up the Resume CV Builder on your local machine, follow these steps:
-
Clone the repository:
git clone https://github.com/themrsami/Resume-CV-Builder.git -
Navigate to the project directory:
cd resume-cv-builder -
Install the dependencies:
pnpm install -
Start the development server:
pnpm dev --turbo -
Open your browser and visit
http://localhost:3000to view the application.
-
Personal Information: Start by filling in your personal details such as name, email, phone, and location.
-
Professional Summary: Write a brief summary of your professional background and key strengths.
-
Work Experience: Add your work history, including company names, positions held, dates of employment, and job descriptions.
-
Education: Input your educational background, including institutions attended, degrees earned, and graduation dates.
-
Skills: List your key skills relevant to your target job or industry.
-
Customization: Adjust the template, font styles, sizes, and colors to match your preferences.
-
Preview: Use the Preview tab to see how your resume looks in real-time as you make changes.
-
Export: Once satisfied, use the export options to print your resume or save it as an image file.
The Resume CV Builder is composed of several key components:
- PersonalInfoSection: Handles input for personal details.
- SummarySection: Manages the professional summary and key highlights.
- ExperienceSection: Allows adding and editing work experience entries.
- EducationSection: Handles educational background information.
- SkillsSection: Manages the list of skills.
- ResumePreview: Renders the live preview of the resume.
Each component is designed to handle its specific section of the resume, making the code modular and easier to maintain.
The Resume CV Builder offers various customization options:
- Templates: Choose from Modern, Classic, or Minimalist designs.
- Font Family: Select from Arial, Helvetica, Times New Roman, or Courier.
- Font Size: Adjust the text size for better readability.
- Font Color: Pick any color for the text to match your style.
- Background Color: Set the background color of your resume.
These options can be found at the top of the builder interface.
Once you've completed your resume, you have several export options:
- Print: Generates a print-friendly version of your resume.
- Export as PNG: Saves your resume as a high-quality PNG image.
- Export as JPG: Saves your resume as a JPG image.
These options are available at the bottom of the builder interface.
- React
- Next.js
- TypeScript
- Tailwind CSS
- shadcn/ui components
- html2canvas (for image export)
Contributions to the Resume CV Builder are welcome! Please follow these steps:
- Fork the repository
- Create a new branch (
git checkout -b feature/AmazingFeature) - Commit your changes (
git commit -m 'Add some AmazingFeature') - Push to the branch (
git push origin feature/AmazingFeature) - Open a Pull Request
This project is licensed under the MIT License.
To test the live website, visit: www.resumecvbuilder.vercel.app