Cv Template

screenshot of Cv Template

Single page cv-template written in html and built with gulp.

Overview:

The objective of this project was to develop a good-looking single page curriculum vitae template using the automation tool gulp. Gulp automates painful or time-consuming tasks in a development workflow.

Features:

  • Single page curriculum vitae template
  • Automation tool gulp for task automation
  • Integration with Google Fonts (Josefin-Sans and Raleway)
  • Use of phantomjs to transform HTML to PDF
  • Customizable content, profile photo, and icons
  • Page options for zoom and border adjustments
  • Live Preview for on-the-fly template changes

Installation (Windows):

  1. Download and install the LTS version of Node.
  2. Download and unzip the cv-template-master.
  3. Open the terminal (cmd.exe) and run the following commands:
cd cv-template-master
npm install

Installation (Linux):

  1. Install Node using the package manager. For Ubuntu/Debian, run:
sudo apt-get install nodejs
  1. Download the cv-template-master and unzip the zip file.
  2. Open the terminal and navigate to the cv-template-master folder.
  3. Run the following command:
npm install

Customize:

  • Edit content: The content of the cv-template is stored in the file ~/Downloads/cv-template-master/app/contents/index.html.js.
  • Change profile photo: Replace profile-photo.jpg and profile-photo-light.jpg in the folder ~/Downloads/cv-template-master/app/assets/images/ with your own images.
  • Change icons: Add custom icons to the folder ~/Downloads/cv-template-master/app/assets/images/icons/. Update the icon attribute in the file ~/Downloads/cv-template-master/app/contents/index.html.js with the new icon file names.

Page Options:

  • Page options are located in the file ~/Downloads/cv-template-master/app/assets/styles/base/_variables.css.
  • Adjust page zoom: Modify the value of the variables $pageZoom or $pageZoomOnWindows (for Windows OS) to fix rendering issues in phantomjs.
  • Adjust page border: Increase the value of the variable $pageBorder if the page content gets cut off when printing.

Live Preview:

  • The Live Preview allows you to view template changes in your browser without running gulp every time.
  • Works for changes made in the index.html, index.html.js, and CSS files in ~/Downloads/cv-template-master/app/assets/styles/ directory.
  • To run the Live Preview, use the following command:
gulp live
  • To stop the Live Preview, press ctrl + c.

Summary:

The curriculum vitae template project aimed to create a visually appealing single page CV template using gulp for automation. The template includes various customization options, such as editing content, changing profile photo and icons, and adjusting page options. Additionally, the Live Preview feature allows for real-time viewing of template changes in the browser.

personal
Personal

A personal website is an online platform that showcases an individual's work, interests, and personality. It can include a range of content, such as a bio, resume, portfolio, blog, and contact information, and is often used to promote one's personal brand or professional services.

template
Templates & Themes

A template or theme refers to a pre-designed layout or structure that provides a basic framework for building a specific type of application or website. It typically includes good design, placeholder content and functional features, allowing developers to customize and fill in the details according to their specific needs.

gulp
Gulp

Gulp.js is an old but popular site building tool that automates various repetitive development tasks in web development, such as compiling Sass, minifying JavaScript, and optimizing images.