Introduction
The 11ty Resume Template is a versatile and customizable solution for creating online resumes using the 11ty static site generator. This template offers a modern, professional design that can be easily tailored to showcase your personal information, skills, work experience, and projects.
Main Features
- Fully customizable resume content
- Semantic HTML structure for better accessibility and SEO
- Theming with TailwindCSS, including dark and light modes
- WCAG AA accessibility compliance
- Self-contained design with no external resources
- Search Engine Optimization (meta tags, JSON-LD)
- High Lighthouse performance scores
- Responsive design for various screen sizes
Installation Steps
- Clone the repository or download the template files
- Navigate to the root folder of the project
- Run the following command to install necessary packages:
npm install
Usage Instructions
To start a development server with live reloading, run:
npm start
To generate a production build, use:
npm run build
Customize your resume by editing the following files:
src/data/author.json
: Update your personal information, skills, work experience, and educationsrc/data/projects.json
: Add details about your recent projectssrc/data/site.json
: Modify site-level details, theme colors, and locale settings
Tailor the design by modifying the TailwindCSS configuration in
tailwind.config.js
Adjust the 11ty configuration in
.eleventy.js
if neededAdd or modify HTML templates in the
src
directory to change the structure of your resume
Important Notes
Ensure all required fields in the JSON files are filled out to avoid layout issues
The template uses JSON files for content, making it easy to update and maintain your resume information
Take advantage of the dark/light theme feature to provide a better user experience
The template is designed to be self-contained, reducing dependencies on external resources
Pay attention to the SEO features, including meta tags and JSON-LD, to improve your resume's visibility in search engines
The template is accessible (WCAG AA compliant), ensuring your resume can be read by a wide audience
Utilize the skills section to highlight your technical proficiencies and categorize them effectively
When adding work experience, use the
isCurrent
attribute to indicate your current positionThe project section allows you to showcase your recent work, including technologies used and your role
Remember to update the site details in
site.json
to ensure accurate metadata for your resume website