Giter VIP home page Giter VIP logo

user-centric-frontend-development-milestone-project-15's Introduction

User Centric Frontend Development Milestone Project 1

Save The Planet

This is a front-end website called "Save The Planet"

This website was created as a project for Code Institute. To view the live site, CLICK HERE

About the website

Recycling is the No. 1 action we can take for the environment, the economy, and our future on this planet. If we recycle more and recycle right, more companies will be able to start using recycled materials in their manufacturing, rather than depleting limited natural resources. Recycling right creates jobs; saves water, energy, and money; and can improve our health and the well-being of all species.

We aim to encourage more HDB residents to recycle using the existing blue recycling bins in their estates, and to educate them on recycling correctly.

UX

The website was built for all residents for an easy reach of basic information about benefits of recycling such as:

" Glass Recycling"

Glass is taken from the bin and taken to a glass treatment plant. The glass is sorted by colour and washed to remove any impurities. The glass is then crushed and melted, then moulded into new products such as bottles and jars. ... Glass does not degrade through the recycling process, so it can be recycled again and again

"Plastic Recycling"

Plastic Recycling helps to reduce the energy usage, It reduces the consumption of fresh raw materials, It reduces the water pollution and the air pollution (from the land filling) by reducing the need for conventional waste disposal and it reduces the greenhouse gases emissions

"Cardboard Recycling"

Benefits of recycling cardboard and brown paper bags,Using a recycled material, rather than a raw material conserves energy and natural resources and helps reduce pollution. Making the pulp used in cardboard creates sulfur dioxide, a gas that causes acid rain. Recycling cardboard cuts that pollution in half

Features

  • Embedded video - shows a short clip from YouTube to give basic idea on how to recycle
  • Google Maps location - interactive way to check the location connecting to Google Maps
  • Social link - Gets the most updated Tweets from Recycle IT page on Twitter
  • Competition page - fill in your details in the form to enter the Competition
  • Resources page - you can get the infomation about the event name and their phone numbers
  • Information - questions and answers with clickable links
  • Subscribe To Our Newsletter
  • Contact us form

Mobile-responsive

  • The webpages work on small to medium devices (i.e. mobile phones to laptops).

Technologies Used

  • HTML and CSS - Base languages used to create the website
  • jQuery
  • Pexels - free download photos
  • Youtube - for the videos on the website
  • Google font - font used

Testing

  • W3C - Validate by direct input
  • Site tested on these browsers: Google Chrome - Internet Explorer - Mozilla Firefox - Microsoft Edge - Safari

Deployment

Acknowledgements

  • I received inspiration for this website from other developers and especially from kids after watching the videos on the webpage

user-centric-frontend-development-milestone-project-15's People

Contributors

abdoelsaih avatar

Watchers

 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.