plasttic-boilerplate v1.3.3
Plasttic HTML Boilerplate
A professional and extensible HTML5 starter template.
About
For every web project, a complete, updated and extensible starting point is essential.
This boilerplate is an HTML template that provides the necessary information to search engines and social media sites, PWA development and more, with a performance strategy.
- Meta tags for SEO.
- Meta tags for Social Media sharing.
- Google Tag Manager script
- Google Analytics script.
- Browser icons.
- PWA icons and information.
- Performance:
- Preload images tag
- Local hosted fonts preload tags.
- Google Fonts tags with preconnect.
- Javascript with defer.
- A simple 404 error page.
- A CSS file with styling for print.
- CSS Reset stylesheet link from Plasttic CSS Reset.
Note: also includes optional starter CSS, JS, Fonts and Social Icons.
The HTML boilerplate was the start of the Plasttic Workflow project.
Start
Quick Start
- Installs the necessary dependencies
- Creates a folder with the
project name
you defined - Downloads and installs the latest version of Plasttic HTML Boilerplate
- Customize (see below)
(cd into your projects folder)
npx create-plasttic-boilerplate
cd <project-name>
Download
- Go to https://github.com/tojeiro-me/Plasttic-boilerplate
- Click on the
Code
tab and selectDownload ZIP
- Unzip the file and move the contents of the
public
folder into your project folder - Customize (see below)
Github New Repo
- Click this link Plasttic Boilerplate template
- Inside the
public
folder are the boilerplate files - Customize (see below)
Snippet
!ptt
shortcut VS Code Snippet- Paste on your global or project snippet file.
- More info about VS Code snippets
Customize
Documentation :construction:: until it's not live, the boilerplate file is filled with comments and resource links.
- Search for "TODO:" in comments, relative to the information that needs to be changed or checked.
- Some information is global, some should be defined per page.
- If .##gitignore## exists, rename it to .gitignore and customize to your project info.
- If using VS Code, use the Todo Tree extension or TODO Highlight, and Better Comments
Follow
License
10 months ago
10 months ago
10 months ago
10 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
12 months ago
12 months ago