Rapid Adaptive Practical Tricked-Out Rocket Framework, or RAPTORFrame, is a light and modular framework which assists in rapidly developing modern frontend projects. The Sass (SCSS) boilerplate, also known as RAPTORSMACSS, is loosely based on the SMACSS architecture pattern.
- Create a new project directory
- Move the
source/
directory, along with thegulpfile.js
andpackage.json
files from theRAPTORFrame/
directory, into the root directory of your project (DO NOT transfer the hidden.git/
directory) - Optionally, repeat the last step with the
.eslintignore
hidden file (the custom scripts should make this unnecessary though) - Within the project root directory, run
npm install
to setup the development environment
Command | Task |
---|---|
npm run raptor |
build the entire frame and root, watch all of the source files |
npm run raptor -- build |
build the entire frame and root |
npm run raptor -- watch |
watch all of the source files |
npm run raptor -- floor |
build the root files to the project root |
npm run raptor -- smash |
build the stylesheets and javascripts |
npm run raptor -- glyph |
build additional glyphs (eot , svg , ttf , woff , and woff2 files) |
npm run raptor -- image |
build and optimize the images (gif , ico , jpeg , jpg , png , svg , tif , and tiff files) |
npm run raptor -- other |
build the assets files |
npm run launch |
Starts a local server and opens the base file in a browser |
npm run lint-js |
Lints the source javascripts with eslint |
- Write thorough documentation, including the following...
source/root/
directory- Transfer made to
frame/
- Edit the hidden files
- Subfolders will not transfer
- Instructional
README.md
file
- Transfer made to
source/glyphs/
directory- Transfer made to
frame/glyphs/
- Only
eot
,svg
,ttf
,woff
, andwoff2
files will transfer - Subfolders will not transfer
- Transfer made to
source/images/
directory- Transfer made to
frame/images/
- Only
gif
,ico
,jpeg
,jpg
,png
,svg
,tif
, andtiff
files will transfer - Subfolders will transfer, for modularity
- Transfer made to
source/javascripts/
directory- All concatenated and uglified to
frame/javascripts/raptor.js
- How and where to add JavaScript files
- What each file and subfolder does
- Subfolders will not transfer
- All concatenated and uglified to
source/media/
directory- Transfer made to
frame/media/
- Only
aac
,avi
,m4a
,mid
,mov
,mp3
,mp4
,ogg
,ogv
,swf
,vtt
,wav
,webm
,wma
, andwmv
files will transfer - Subfolders will transfer, for modularity
- Transfer made to
source/stylesheets/
directory- All compiled and minified to
frame/stylesheets/raptor.css
- How and where to add SCSS files
- What each file and subfolder does
- Subfolders will not transfer
- All compiled and minified to
source/views/
directory- Transfer made to
frame/
- Subfolders will transfer, for modularity
- Transfer made to
- Add the following...
- Linters
scss-lint
csslint
(maybe...)- Some for views
- Some for markup languages (maybe...)
- Linters
- Create the following...
- View files
404.html
(maybe...)422.html
(maybe...)500.html
(maybe...)
- SCSS files
- A
@font-face
mixin for glyphs (maybe...)
- A
- Images
- RAPTORFrame logo –
.png
and/orsvg
- RAPTORFrame
og:image
–.jpg
or.png
- New
rapticon-16x16.ico
and newrapticon-16x16.png
apple-touch-icon.jpg
orapple-touch-icon.png
- RAPTORFrame logo –
- Lib directories
- CSS libraries, non-compiled (maybe...)
- JavaScript libraries, non-compiled (maybe...)
- View files
The humans responsible and technology colophon.
- Ali Esmaili (Developer & Designer): AESM
- Molly Allison-Baker (Consultant): hermitina
- Allan Enemark (Consultant): exactlyAllan
This project is copyright © 2015-2016 Ali Esmaili | SuitAndCape. It is free software that may be redistributed under the terms specified in the LICENSE.
This is based on The MIT License (MIT). For more information, visit the Open Source Initiative website.
🎩 | 🚀 |
---|---|
SuitAndCape GitHub | https://github.com/SuitAndCape |
Personal GitHub | https://github.com/AESM |
Website | http://SuitAndCape.github.io/ |
https://www.linkedin.com/in/SuitAndCape | |
https://twitter.com/SuitAndCape |