Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/fourjuaneight/resume
💼 Web-based resume with printable design.
https://github.com/fourjuaneight/resume
11ty tailwindcss
Last synced: about 1 month ago
JSON representation
💼 Web-based resume with printable design.
- Host: GitHub
- URL: https://github.com/fourjuaneight/resume
- Owner: fourjuaneight
- License: mit
- Created: 2021-06-01T17:24:48.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2024-07-26T01:42:59.000Z (5 months ago)
- Last Synced: 2024-07-26T03:11:42.296Z (5 months ago)
- Topics: 11ty, tailwindcss
- Language: SCSS
- Homepage: https://resume.juanvillela.dev
- Size: 5.07 MB
- Stars: 2
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Resume
## Features
* Fully Customizable
* Semantic HTML
* Accessible (WCAG AA)
* [h-resume](http://microformats.org/wiki/h-resume) Microformat
* Self-Contained (no external resources)
* Search Engine Optimized (meta, JSON-LD, etc...)
* Critical CSS Inlined
* Print Styles
## Getting Started
__The project is based on [Node](https://nodejs.org/en/) and was tested with v10.15__. Newer versions can apparently cause problems with some of the dependencies - I'm working on resolving this soon.
To install the necessary packages, run this command in the root folder of the site:
```
npm install
```
__Commands__
* Run `npm start` for a development server and live reloading
* Run `npm run build` to generate a production build
## Customize your Resume
To edit the content and design of your resume, follow these steps:
### 1. Personal Details
Open `src/data/author.json` and edit the information describing yourself. The following properties are supported (optional properties can be removed from the JSON file):
Key
Description
Required
name
your full name
required
occupation
your job description
required
location
your town/state
optional
avatar
the file name of your profile photo. Must be located in src/assets/images/
optional
pronouns
your preferred gender pronouns
optional
email
your email address
optional
telephone
your phone number
optional
website
your personal website
optional
skills
an array of strings describing your skillset
optional
languages
an array of objects describing your spoken languages; each object should include a name (e.g. "English") and level (e.g. "fluent") property
optional
social
an array of objects for each social profile you want to link; each object should include a name (e.g. "Github"), user (e.g. "@maxboeck") and url (e.g. "https://github.com/maxboeck") property
optional
### 2. Introduction
Open `entries/content/introduction.md` and edit the text content of the file with your personal short introduction summary. Limit it to 2-3 sentences and convey your motivation. You can edit the title of the section here as well.
### 3. Work Experience & Education
The entries for the sections "work experience" and "education" are stored as markdown files in `src/entries/work` and `src/entries/education`.
Delete the demo files in there and create your own. The text should describe your responsibilities, learnings or achievements. Include the following [frontmatter](https://www.11ty.dev/docs/data-frontmatter/) data:
Key
Description
Required
title
the title of the entry. in "work experience", this sould be your role/position, in "education" this should be the degree/certification earned.
required
start
ISO timestamp of when you started this job or education.
required
end
ISO timestamp of when you ended this job or education. If not defined, that entry will say "- Present"
optional
organization
name of your employer (when "work") or school (when "education")
optional
organizationUrl
link to website of your employer (when "work") or school (when "education")
optional
location
location of company or school
optional
### 4. Custom Content
Edit `entries/content/custom.md` if you want to edit freeform content to the end of the CV. This could be a legal disclaimer or an additional section. Delete the file if you don't want this section to show up.
### 5. Meta Data & Design
Open `src/data/meta.json` and replace the `url` with the URL of your hosted resume. You can also customize the language and color scheme here.
Supported properties are:
Key
Description
Required
url
the URL of your hosted resume, e.g. "https://my-resume.com". (no trailing slash)
required
lang
the 2-digit language identifier of your resume, e.g. "en", "de", etc.
required
locale
the locale code of your resume, e.g. "en_US", "de_DE", etc.
required
colors.primary
The HEX code of the primary brand color. defaults to blue #005b96
optional
colors.secondary
The HEX code of the secondary brand color. defaults to red #fc6767
optional
### 6. Internationalization
There are a few hardcoded english strings used in the template, such as the section titles and some labels. If you want to change the default language from english to something else, you can translate these strings by changing the values in `data/strings.json`.
## Credits
Thanks to [Eric Bailey](https://ericwbailey.design/) for his post ["How to not make a resume in React"](https://ericwbailey.design/writing/how-to-not-make-a-resume-in-react.html), which gave me the idea.
## Colophon
* "Butler" headline font by [Fabian de Smet](https://fabiandesmet.com/portfolio/butler-font/) (CC BY-SA 4.0 [License](https://github.com/maxboeck/resume/tree/master/src/assets/fonts/Butler_ButlerStencil_FontLicense_v1_0.pdf))
* Avatar image generated by GAN at [thispersondoesnotexist.com](https://www.thispersondoesnotexist.com/).