/web_playground

Harry's web development playground.

Primary LanguageJavaScriptOtherNOASSERTION

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