This project is one of Udacity's Frontend Nanodegree projects. We use Pagespeed Insights to measure the performance of webpage. The original project files exist in src folder.
You could visit this link.
- Added classes like
content-li
to DOM inindex.html
,project-2048.html
,project-mobile.html
andproject-webperf.html
. - Changed some CSS name in
css/style.css
file. - Changed the CSS's
href
location and added__inline=true
to<link>
html files. - Added media query to html files.
- Encoded an image in
views/pizza.html
into base46 file. - Changed some image file names in
img
tags inviews/pizza.html
. - Add
scrollHandler
toviews/js/main.js
. - Made some changes to function
changePizzaSizes
inviews/js/main.js
. - Made some changes to function
updatePositions
inviews/js/main.js
.
-
Clone this project
-
Install ImageMagick
$> brew install ImageMagick
If you are using ubuntu, checkout this post to install ImageMagick.
-
Run following code to install the environment
$> npm install $> grunt
-
All production code will be located at
dist
-
Open
dist/index.html
-
Or you cold run this project on your local server
- For those who use Python on the local machine
$> python -m SimpleHTTPServer 8000
* For those who use PHP on the local machine,
$> php -S localhost:8000
-
Open a browser and visit localhost:8000
-
Also, you could download and install ngrok to the top-level of your project directory to make your local server accessible remotely.
$> cd /path/to/your-project-folder
$> ./ngrok http 8000