Pagepro Blog

Internship

Front-end Internship: Day 4

Posted on .

Front-end Internship: Day 4

Introduction

I. Learn basic CSS animations.

Get CSS animations course form your mentor. Check all the lessons, push the effects into your GitHub repository.

II. Convert the following PSD (Photoshop) web design to HTML/CSS/JS.

Source files

Requirements

  1. Level Easy:
    • Prepare project without custom fonts.
  2. Level Medium
    • Add Google Webfonts
    • Add HTML5 validation for Contact Form
  3. Level Hard:
    • Add the slider for team members

Workflow

  1. Create project using the latest version of LibSASSerplate
  2. Use HTML5 / SASS
  3. Stick to AirBnB SCSS/CSS styleguide.
  4. Create new GitHub repository for this project and push changes frequently:
    1. First Commit: HTML with project structure
    2. Second Commit: HTML for HEADER
    3. … small parts of HTML sections as separate commits
    4. CSS for base styles
    5. CSS for HEADER
    6. … small parts of CSS for specific sections as separate commits.
  5. Ask your Mentor for feedback after:
    1. Preparing whole HTML for whole Page.
    2. Preparing whole CSS for Page.
  6. Recommended tools:
    1. https://validator.w3.org
    2. http://www.welldonecode.com/perfectpixel/

Supported browsers

  • Firefox (latest version)
  • Google Chrome (latest version)
  • Microsoft Edge
  • Internet Explorer 10 / 11
Chris Lojniewski

Chris Lojniewski

http://pagepro.co

There are no comments.
View Comments (0) ...
Navigation