Harry's web development playground.
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
dev
public
report
routes
server
views
.gitignore
.scss-lint.yml
.snyk
LICENSE
README.md
app.js
gruntfile.js
package.json
screenshot.png
server.js

README.md

Web Playground

Built with Grunt

A web playground, demonstrating variety of website development techniques using best practices and standards.

Built for the University of Bristol unit Web Technologies.

Setup

Install dependencies and read about grunt first!

  • npm install
  • sudo npm install -g grunt-cli (to install grunt globally)
  • grunt server - view at http://localhost:3001/

Screenshot

Dependencies

  • Clone project with Git. git clone git@github.com:harrymt/web_playground.git

  • Navigate to that directory cd web_playground

  • Install NodeJS

  • Install Ruby.

  • (optional) Install global SCSS linting with:

    • gem update --system && gem install scss_lint
    • OR: sudo apt-get install scss_lint
  • Install sqlite3 is setup and added to your PATH

Grunt

The whole project uses GruntJS to handle everything from running to deployment.

  • Run node_modules/grunt-cli/bin/grunt to run grunt, or
  • Install grunt globally, with sudo npm install -g grunt-cli

Each one of the following tasks should be run using grunt <task> e.g. grunt build.

Gruntfile.js

/**
 * Start Server.
 *
 * Start a Node server - view at localhost:3001.
 *
 * $ grunt server
 */
grunt.registerTask('server', ['exec:server']);

/**
 * Build.
 *
 * Minify and create CSS files
 *
 * $ grunt build
 */
grunt.registerTask('build', ['uglify', 'sass']);

/**
 * Deploy.
 *
 * Deploy to heroku server then run page insight tests
 *
 * $ grunt deploy
 */
grunt.registerTask('deploy', ['lint', 'build', 'exec:deploy', 'pagespeed']);

(Optional)

  • To deploy download Heroku CLI
  • Login to heroku by typing heroku login

Online Testing

These scores were for the hosted version of this site on heroku (currently offline).

Score

Validators

Possible Future Additions

  • Run static analysis tools on CSS, HTML and Javascript

Technologies Used