Skip to content
master
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

README.md

ptemplate

Dependencies DevDependencies

A personal website template that's not a pain in the ass to setup and use.

Demo

Example screenshot alt text

Requirements

  • You need to have yarn (recommended) or npm installed.

Useful commands

Yarn

  • yarn - Install and update dependencies.
  • yarn dev - Launch local web server with hot compiling. Ideal to work on the project easily.
  • yarn build - Build the website in production mode to the dist/ folder.
  • yarn build-gz - Builds a gzip compressed version of the built app in the dist/ folder.
  • yarn build-render - Build the website in production mode and pre-render it to the dist/ folder.
  • yarn pre-render - Pre-renders the previously built website.

NPM

  • npm install - Install and update dependencies.
  • npm run dev - Launch local web server with hot compiling. Ideal to work on the project easily.
  • npm run build - Build the website in production mode to the dist/ folder.
  • npm run build-gz - Builds a gzip compressed version of the built app in the dist/ folder.
  • npm run build-render - Build the website in production mode and pre-render it to the dist/ folder.
  • npm run pre-render - Pre-renders the perviously built website.

Customization

Note: To apply all of these changes you must rebuild the app.

If you're not hosting the app at the root of the server

Go to webpack.config.js and change the constant BASE_URL, be sure it ends with a /.
PRE-RENDER DOESN'T WORK WITH CUSTOM BASE_URL

Favicons

You can replace them at src/assets/icons/.

Avatar

You can replace it at src/assets/. If the name or the extension is different to "avatar.svg", you need to modify it in src/config.js and src/assets-imports.js.

Title

Change the <title> tag in src/index.html.

Most of the UI (description, work content, contact icons...)

Modify src/config.js. You can add, remove or modify its contents.

ReCATPCHA public key

Change it in src/config.js.

Translations

Customize them in the src/assets/lang/ folder. Add a new lang file named by the IEC_15897 standard, paste contents from your source locale and translate it. To activate a language copy the contents from the source locale to src/asssets/lang.json.

Add icons

Add new icon paths with the desired ID in the src/assets/icons.svg file.

Usage

Once everything is compiled and built the last step is to serve the contents of the dist/ folder as static files with your web server of choice and you're done!

Form API

The form of the contact page is sended to the address specified in src/config.js as formUrl. The request have:

  • Method: POST
  • Header: Content-Type: "application/json; charset=UTF-8"
  • Body:
{
    "name": "Name introduced in the form",
    "mail": "Email introduced in the form",
    "msg": "Text/Message introduced in the form",
    "g-recaptcha-response": "Google's reCAPTCHA v2 response for server-side validation"
}

You can implement your own backend, or use any of the compatible backends listed below.

Compatible form backends

Run on Repl.it

You can’t perform that action at this time.