A collection of test and evaluations that would happen at a professional football training camp.
- 40-yard dash
- Throw a football through a tire
- Bench press reps
- 3-cone drill
This project is built on the epsilon-base scaffold, which is architected to simplify the build of site templates using a componentized approach. It is intended for easier hand-off of code for implementation into a content management system like Adobe AEM or Sitecore.
One of the major advantages of this scaffold is that it supports building partial HTML files that can be included in other HTML files. This can reduce the amount of duplicate code that you need to maintain during development.
Here is an example of how includes work.
In this file, partials are being included for the site header and footer. Note that you can inject variables into partials.
@@include('app/_templates/_partials/header.html', {
"pageTitle" : "My Page Title"
})
<div>
<p>Page content goes here.</p>
</div>
@@include('app/_templates/_partials/footer.html')In this file, the injected variable is being referenced as @@pageTitle.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>@@pageTitle</title>
</head>
<body>When the project's build task is run, it will find all referenced includes and build a single compiled HTML file.
File includes are supported by the gulp-file-include plugin.
If statements are also supported and can be implemented as follows:
@@include('app/_templates/_partials/nav.html', {
"selectNav": "products"
})<ul>
<li><a href="/" @@if (selectNav == "home") { class="selected"}>Home</a></li>
<li><a href="/products" @@if (selectNav == "products") { class="selected"}>Products</a></li>
<li><a href="/about" @@if (selectNav == "about") { class="selected"}>About</a></li>
</ul>All files that you want to have generated as compiled HTML should be added to the app/_templates/_masters folder. Any files that will be included as partials should be saved to app/_templates/_partials.
This project uses Gulp to run build and other tasks. These are the most important commands that are available to you:
gulp serve
Runs a local instance of the site with BrowserSync to automatically refresh the page as you make updates.
gulp build
Builds a compiled version of the site into the dist/ folder. Concatenates and minifies all files for delivery.
gulp prepdeploy
Builds a compiled version of the site into the appengine/static folder for deploy to App Engine. You will need to run gulp build before running this command. Use this for internal staging purposes only.
gulp clean
Removes the dist/ folder.
gulp lint
Runs linter to look for errors and warnings in your Javascript code. Lint is also included as part of the gulp build task, but this command lets you run the linter on its own. The linter will validate using the rules in the .eslintrc file in this project.
gulp serve:test
Runs unit tests.
HTML files that should be generated as compiled pages should be added here.
HTML files intended for use only as file includes should be added here.
Javascript files should be added here.
SCSS code should be added here.
This is the configuration file needed to deploy to App Engine. Import this file into the Google App Engine SDK (use the version for Python).
Files in this folder will be deployed to App Engine. Build files into this folder using the gulp prepdeploy command.
Files are compiled and copied into this folder when running gulp build.
Unit tests should be added here. Run unit tests with gulp serve:test.
Babel config settings for compiling Javascript.
Configures path to bower_components folder.
Config settings for IDEs with lint plugins.
Rules configuration for the Javascript linter.
Task runner configuration. You can add or modify the gulp commands here.