Screenshot of 11ty Resume Template

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

  1. Fully customizable resume content
  2. Semantic HTML structure for better accessibility and SEO
  3. Theming with TailwindCSS, including dark and light modes
  4. WCAG AA accessibility compliance
  5. Self-contained design with no external resources
  6. Search Engine Optimization (meta tags, JSON-LD)
  7. High Lighthouse performance scores
  8. Responsive design for various screen sizes

Installation Steps

  1. Clone the repository or download the template files
  2. Navigate to the root folder of the project
  3. Run the following command to install necessary packages:
    npm install
    

Usage Instructions

  1. To start a development server with live reloading, run:

    npm start
    
  2. To generate a production build, use:

    npm run build
    
  3. Customize your resume by editing the following files:

    • src/data/author.json: Update your personal information, skills, work experience, and education
    • src/data/projects.json: Add details about your recent projects
    • src/data/site.json: Modify site-level details, theme colors, and locale settings
  4. Tailor the design by modifying the TailwindCSS configuration in tailwind.config.js

  5. Adjust the 11ty configuration in .eleventy.js if needed

  6. Add or modify HTML templates in the src directory to change the structure of your resume

Important Notes

  1. Ensure all required fields in the JSON files are filled out to avoid layout issues

  2. The template uses JSON files for content, making it easy to update and maintain your resume information

  3. Take advantage of the dark/light theme feature to provide a better user experience

  4. The template is designed to be self-contained, reducing dependencies on external resources

  5. Pay attention to the SEO features, including meta tags and JSON-LD, to improve your resume's visibility in search engines

  6. The template is accessible (WCAG AA compliant), ensuring your resume can be read by a wide audience

  7. Utilize the skills section to highlight your technical proficiencies and categorize them effectively

  8. When adding work experience, use the isCurrent attribute to indicate your current position

  9. The project section allows you to showcase your recent work, including technologies used and your role

  10. Remember to update the site details in site.json to ensure accurate metadata for your resume website

11ty Resume Template

An online resume template

Theme Information:

Stars : github star9
Updated : 09 Jan, 2024
Published : 04 Jan, 2024
Types :
Eleventy IconPostCSS IconTailwind IconMarkdown Icon