No description or website provided.
Clone or download
Zakk Fleischmann
Latest commit db510d8 Jan 21, 2020
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.github Update ISSUE_TEMPLATE.md Oct 7, 2019
.vscode Add .prettierrc, Issue + PR templates Aug 23, 2019
.prettierrc Add .prettierrc, Issue + PR templates Aug 23, 2019
CONTRIBUTING.md initial commit Jan 2, 2019
LICENSE initial commit Jan 2, 2019
README.md update readme to include links to provided Adobe XD mocks Jan 21, 2020
STYLE.md initial commit Jan 2, 2019

README.md

General Assembly Logo

Build a Responsive Website!

For your first project, you're going to build a responsive website using HTML and CSS. You'll pick one of a few provided designs and build an honest replica of it.

Instructions

  1. Create a new repository on GitHub (not GitHub Enterprise).
  2. Clone down the repository and complete your work in there.
  3. Fulfill the listed requirements below.

Please turn in your submission by the deadline on your cohort calendar.

Requirements

Pick a design implemented in Adobe XD from the provided collection of designs.

You can find the designs here.

Pick from the Easy or Medium folders. Pick something that seems challenging but manageable!

The goal is to build an accurate clone of your chosen site. Do your best to get everything looking as similar as possible. Treat it like you were handed this mockup and given a deadline to deliver it. Use all the available resources you've been given - documentation, your peers, your instructors, placeholder images, etc.

Additionally, your site should be responsive (meaning it looks good on mobile, tablet, and desktop).

Use media queries to rearrange content so that it looks good on different devices. If your mock only has designs for desktop, then it's up to you to figure out how to make it look good on mobile. Great! It's really common in the industry for designers to come up with the desktop designs and then have the developers figure out the best way to present it on mobile and tablet.

Finally, you should deploy your website to GitHub Pages. This is a free hosting service provided by GitHub for deploying static websites (no server or database). This is the part of the project that you get to figure out on your own! 😃

In sum, the requirements for this project are:

  • Pick a mock and implement it with HTML and CSS
  • Make your mock responsive using media queries
  • Deploy your website to GitHub Pages

Helpful Suggestions

Don't spend too much time getting the images exactly right. If you need to, pick a placeholder stock image from Unsplash.

Work on the structure first. Don't get stuck in the weeds with details until you've got most of the high level stuff done. This means start with the container/row/column pattern and fill them in as you go along.

Try to find the exact font on Google, if you can. Don't pay for a font! Instead, use Google fonts and try to find a font that is close to the one in the design!

Plagiarism

Take a moment to refamiliarize yourself with the Plagiarism policy. Plagiarized work will not be accepted.

License

  1. All content is licensed under a CC­BY­NC­SA 4.0 license.
  2. All software code is licensed under GNU GPLv3. For commercial use or alternative licensing, please contact legal@ga.co.