Giter VIP home page Giter VIP logo

responsivetest's Introduction

Responsive Test

This tool is used to test responsive layout. You can see the live demo on http://responsivetest.net.

Powered by jQuery, Bootstrap 3, and AngularJS.

You should also check BootstrapValidator, the best jQuery plugin to validate form fields. It's another cool thing by @nghuuphuoc

ResponsiveTest screen shot

Download and run

  • Download ResponsiveTest from the Github page directly. It's also possible to download the tool with bower:
$ bower install responsivetest
  • Point your web server to the ResponsiveTest directory. You can use python to simplify this step by running the following command:
$ python -m SimpleHTTPServer <port>

Then, access the browser at http://localhost:<port>

ResponsiveTest is written in CSS, Javascript, and HTML entirely. The tool uses an Ajax request to retrieve the devices data which is stored in an external file (data/devices.json).

As you know, the browser doesn't allow to do it if the file is served locally due to security concern Origin null is not allowed by Access-Control-Allow-Origin

That's why we need to run it with a HTTP server.

Add more devices

The device sizes are defined in data/devices.json file.

If you want it to support more devices and screen resolutions, please fork the project and pull a new request.

You don't have to rebuild if you only change the data/devices.json file.

By default, the tool will randomly load an URL found in randomUrls section from data/devices.json.

Build

The build process finds the CSS, JS files in the src and compresses them, places compressed files in the dist directory.

First, use grunt to install the dependent packages:

$ npm install grunt --save-dev
$ npm install grunt-contrib-copy --save-dev
$ npm install grunt-contrib-cssmin --save-dev
$ npm install grunt-contrib-uglify --save-dev
$ npm install grunt-ngmin --save-dev

Then, execute the following command to build:

$ grunt

Author

ResponsiveTest is developed by Nguyen Huu Phuoc

Big thanks to the contributors:

License

Copyright (c) 2013 Nguyen Huu Phuoc

ResponsiveTest is licensed under the MIT license.

responsivetest's People

Contributors

nghuuphuoc avatar huuphuoc avatar arvinquilao avatar hantuzun avatar turigabor avatar

Watchers

Hasan Gundogdu avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.