My résumé, built with NuxtJS and Tailwind CSS: https://resume.nathanfriend.io (or view as a PDF)
All of the content of this résumé is sourced from
resume-data.json. This file loosely adheres to the
resume.json schema (with some additional
properties for display purposes). See the resume.json section
below for more info about
resume-data.private.json file can be created alongside
resume-data.json. This file is
contents will be merged into
building this résumé. This is used to protect personal info such as phone
numbers and addresses, while still allowing this data to appear in
This project’s visual style was heavily inspired by the Universal Résumé Template.
As part of the CI pipeline, a
resume.json file that conforms to the
resume.json schema is extracted from
resume-data.json and automatically pushed to a GitLab
Snippet and a GitHub
ci/generate-resume.json.js script is
responsible for this work.
You can view the rendered result at https://registry.jsonresume.org/nfriend.
Generating a résumé locally
To generate a résumé locally, simply start the dev server (
yarn dev) and print
the web page (⌘/Ctrl+P) as a PDF. In fact, this
is exactly how the PDF is generated by the pipeline. Since the pipeline uses
printing the résumé locally using Chrome will provide the most consistent
Why not just use the PDF generated by the pipeline?
The pipeline generates a PDF using only the public information found in
resume-data.json and does not include any private data
resume-data.private.json. (For example, phone numbers.)
# install dependencies $ yarn # serve with hot reload at localhost:3000 $ yarn dev # generate static project $ yarn generate
For other useful commands, check out the
scripts defined in
yarn script in particular –
yarn html-lint – requires some setup before
it will run:
- Install Ruby
- Install Bundler
bundle installat the root of this project
yarn generateto generate a production build in
Once these prerequisites have been completed, running
yarn html-lint will run
html-proofer on the output
*.html. This is particularly useful for validating that all external links are
During deployment, all Nuxt-related
<script> elements are stripped from the
compiled HTML. This is accomplished by the
yarn strip-scripts command, which
ci/strip-script-elements.js. This works
because this application is fully rendered at build time and requires no
<script> elements allows the end result to be truly static (no
(yet) supported by Nuxt.
For detailed explanation on how things work, check out Nuxt.js docs.
All résumé content in
resume-data.json (or generated by
ci/generate-resume.json.js) is Copyright
Nathan Friend © 2020 and may not be reused without my permission.
All other directories and files are MIT Licensed. If you make use of any code found in this project, a link back to https://gitlab.com/nfriend/nuxt-resume would be appreciated, but is not required.
Icons were sourced from Font Awesome (license). No changes were made to the icons.