Overview
The useResume hook provides access to the resume data context and all methods for managing resume content. It must be used within a ResumeProvider.
import { useResume } from './hooks/useResume';
function MyComponent() {
const { resumeData, updatePersonalInfo } = useResume();
// ...
}
Return Type
The hook returns a ResumeContextType object with the following properties:
interface ResumeContextType {
resumeData: ResumeData;
setResumeData: React.Dispatch<React.SetStateAction<ResumeData>>;
selectedTemplate: ResumeTemplate;
setSelectedTemplate: React.Dispatch<React.SetStateAction<ResumeTemplate>>;
updatePersonalInfo: (field: keyof ResumeData['personalInfo'], value: string) => void;
updateSummary: (value: string) => void;
addExperience: () => void;
updateExperience: (id: string, field: keyof Experience, value: any) => void;
removeExperience: (id: string) => void;
addEducation: () => void;
updateEducation: (id: string, field: keyof Education, value: any) => void;
removeEducation: (id: string) => void;
addSkill: (skillName: string) => void;
removeSkill: (id: string) => void;
addProject: () => void;
updateProject: (id: string, field: keyof Project, value: any) => void;
removeProject: (id: string) => void;
addCustomSection: (title: string) => void;
updateCustomSection: (id: string, title: string) => void;
removeCustomSection: (id: string) => void;
addCustomSectionItem: (sectionId: string) => void;
updateCustomSectionItem: (sectionId: string, itemId: string, field: keyof CustomSectionItem, value: string) => void;
removeCustomSectionItem: (sectionId: string, itemId: string) => void;
reorderSections: (newOrder: SectionId[]) => void;
}
State
The complete resume data object containing all sections
setResumeData
React.Dispatch<React.SetStateAction<ResumeData>>
Direct state setter for resume data (use specific update methods when possible)
The currently selected resume template ('classic', 'modern', or 'minimal')
setSelectedTemplate
React.Dispatch<React.SetStateAction<ResumeTemplate>>
Updates the selected resume template
Personal Info Methods
updatePersonalInfo
Updates a specific field in the personal information section.
field
keyof PersonalInfo
required
The field to update (e.g., 'fullName', 'email', 'phone')
The new value for the field
const { updatePersonalInfo } = useResume();
updatePersonalInfo('fullName', 'John Doe');
updatePersonalInfo('email', '[email protected]');
updateSummary
Updates the professional summary section.
const { updateSummary } = useResume();
updateSummary('Experienced software engineer with 5 years...');
Experience Methods
addExperience
Adds a new empty experience entry to the resume.
const { addExperience } = useResume();
addExperience();
updateExperience
Updates a specific field of an experience entry.
The unique ID of the experience entry
The field to update (e.g., 'company', 'position', 'current')
The new value for the field
const { updateExperience } = useResume();
updateExperience('exp-id-123', 'company', 'Acme Corp');
updateExperience('exp-id-123', 'current', true);
removeExperience
Removes an experience entry from the resume.
The unique ID of the experience entry to remove
const { removeExperience } = useResume();
removeExperience('exp-id-123');
Education Methods
addEducation
Adds a new empty education entry to the resume.
const { addEducation } = useResume();
addEducation();
updateEducation
Updates a specific field of an education entry.
The unique ID of the education entry
The field to update (e.g., 'school', 'degree', 'field')
The new value for the field
const { updateEducation } = useResume();
updateEducation('edu-id-456', 'school', 'MIT');
updateEducation('edu-id-456', 'degree', 'Bachelor of Science');
removeEducation
Removes an education entry from the resume.
The unique ID of the education entry to remove
const { removeEducation } = useResume();
removeEducation('edu-id-456');
Skills Methods
addSkill
Adds a new skill to the resume.
The name of the skill to add
const { addSkill } = useResume();
addSkill('React');
addSkill('TypeScript');
removeSkill
Removes a skill from the resume.
The unique ID of the skill to remove
const { removeSkill } = useResume();
removeSkill('skill-id-789');
Project Methods
addProject
Adds a new empty project entry to the resume.
const { addProject } = useResume();
addProject();
updateProject
Updates a specific field of a project entry.
The unique ID of the project entry
The field to update (e.g., 'name', 'description', 'technologies')
The new value for the field
const { updateProject } = useResume();
updateProject('proj-id-321', 'name', 'E-commerce Platform');
updateProject('proj-id-321', 'technologies', ['React', 'Node.js']);
removeProject
Removes a project entry from the resume.
The unique ID of the project to remove
const { removeProject } = useResume();
removeProject('proj-id-321');
Custom Section Methods
addCustomSection
Adds a new custom section to the resume.
The title of the custom section (e.g., “Certifications”, “Publications”)
const { addCustomSection } = useResume();
addCustomSection('Certifications');
updateCustomSection
Updates the title of a custom section.
The unique ID of the custom section
The new title for the section
const { updateCustomSection } = useResume();
updateCustomSection('section-id-999', 'Professional Certifications');
removeCustomSection
Removes a custom section from the resume.
The unique ID of the custom section to remove
const { removeCustomSection } = useResume();
removeCustomSection('section-id-999');
addCustomSectionItem
Adds a new item to a custom section.
The unique ID of the custom section
const { addCustomSectionItem } = useResume();
addCustomSectionItem('section-id-999');
updateCustomSectionItem
Updates a specific field of an item in a custom section.
The unique ID of the custom section
The unique ID of the item within the section
field
keyof CustomSectionItem
required
The field to update (e.g., 'title', 'description')
The new value for the field
const { updateCustomSectionItem } = useResume();
updateCustomSectionItem('section-id-999', 'item-id-111', 'title', 'AWS Certified Developer');
removeCustomSectionItem
Removes an item from a custom section.
The unique ID of the custom section
The unique ID of the item to remove
const { removeCustomSectionItem } = useResume();
removeCustomSectionItem('section-id-999', 'item-id-111');
Section Management
reorderSections
Reorders the sections on the resume.
Array of section IDs in the desired order
const { reorderSections } = useResume();
reorderSections([
'personal-info',
'summary',
'skills',
'experience',
'education',
'projects',
'customSections'
]);
Provider Setup
Wrap your application with ResumeProvider to enable the hook:
import { ResumeProvider } from './hooks/useResume';
function App() {
return (
<ResumeProvider>
{/* Your app components */}
</ResumeProvider>
);
}
Data Persistence
The hook automatically persists data to localStorage under the keys:
resume-builder-data - Resume dataresume-builder-template - Selected template
Data is loaded on mount and saved whenever it changes.
