Write your CV/Resume Easily with HTML & CSS!
CVBuilder.dev is a Web App that helps you you create your CV in HTML & CSS, it's written in pure JS and hosted by Github.
There is multiple templates available, ready to use and perfect for a good start!
CVBuilder.dev should be easy to use, on one side you see the current result, and on the other you have editor blocks to enter the HTML & CSS.
- Open & Import HTML, use to import a previously saved resume.
- Save As HTML, save the resume in one
.htmlfile to be able to use it again. - Export As PDF, to generate a flat A4 PDF that you can easily share.
- Print, open the print dialog box of your browser.
- Select Mode, it's the default mode you can select the text of the preview.
- Move Mode, in this mode you are in "hand" mode, this means that you can move the preview by clicking and dragging. If you have a trackpad you can pinch to zoom-in / zoom-out.
- Then the zoom controls, there is no real need to explain what it does :)
- Finally two button similar as in Adobe Reader / Acrobat, the first one will fit the preview in the available width.
- And the other one to fit the preview in the available space.
Check below a detailed view of the interface:
You experienced print issues? The background and/or part of the style (CSS) is not displayed?
This is due to some settings you need to change in the print preview window, for more information check this page.
The whole source code is on the gh-pages branch of this repository.
The preview is a virtual sandboxed iFrame, virtual because the iFrame doesn't point to a true file/page, and sandboxed to avoid code injection into the web app.
The editor blocks are currently instances of Ace editor. The project will maybe move to Code Mirror in the futur to improve CSS coverage.
The HTML to PDF is done by the combo of two libraries, first html2canvas to create an image (PNG) of the Preview in the form of an HTML canvas, then set this image into a PDF with img2pdf.
Currently you can only work on one page at a time, if you have a multi pages resume to build:
- Start by creating the first page, then save the HTML with the Save As HTML button and Export as PDF
- Edit the HTML content to create the next page, do the same thing Save As HTML button and Export as PDF
- Redo the opperation for every pages you need.
- Then with a website like ilovepdf.com or combinepdf.com combine the PDF pages into one single PDF.
Since you have saved as HTML all the pages you can import them back to CVBuilder.dev to edit them and re-export them as PDF.
I haven't planned to add support for Sass / SCSS, Stylus or any other CSS preprocessor, this would require a step of convertion between the STYLE editor block and Preview.
And the major issue is when saving as an HTML file to be able to use it later, you will lose the preprocessor and get instead pure CSS. This would require replacing the export as HTML process with an export as JSON to be able to store HTML (for HEAD & BODY), and STYLE code without forget to store the format used (CSS, Sass, SCSS, ...).
If you want to dig into that and do a pull request to add this use feature, feel free 😊
Exactly the same answer as for the Sass / SCSS 🙂
Since the project is hosted on Github (via Github Pages), and use Jekyll, there is no server operations it's all client side JS code. This makes it impossible to have a User Session with login, saved files, back-ups. The maximum we can set is Local Storage ("successor" of cookies) to store some variables.
I actively encourage and support contributions.
Feel free to fork and improve/enhance CVBuilder.dev any way you want. If you feel that the web app and/or the community will benefit from your changes, please open a pull request.
You just created a stunning Resume and want to share it as a template for the community? Open a pull request.
You don't know how to contribute ? How to open a pull request ? No worries, check this page!
CVBuilder.dev has been created and is currently maintained by Ben Souchet.
- Third party libraries used for this project (in
/assets/js/vendor/) have there own licenses accessible in their respective sub-folders. - The font used
JetBrains Monois under the SIL Open Font License 1.1. - Apart from that, the rest of the elements (code, images, font) in this repository are under MIT license.