Updated Friday, May 28, 2021
This document is available at:
https://reskillamericans.github.io/info-2021/tracks/front-end
Please report problems with this document at our Issue Tracker.
Your instructors and mentors in this course include:
Name | Slack Username |
---|---|
Sophia Ahuoyiza Abubakar | @Ahuoyiza |
Ninyo Esther | @Ninyo |
Patrick Odey | @Patrick Odey |
Jeremiah Iromaka | @jeremiahiro |
Jeffrey Ogah | @Jeff |
Okoro Alvin Uchenna | @Alvin |
Goodnews Sandy | @Sandy |
Jimi Adeboga | @Jimi |
Duru-young Raymond | @ray |
Idris Lawal | @Idris |
You are welcome to message them directly, but please post questions that would benefit all of your peers at #track-frontend.
The following course list covers the specific courses in your track. Please also note the General Courses listed in the top level Program Info Page.
This we we discuss DOM manipulation and the ReactJS DOM-rendering library.
This week we are going back to JavaScript programming convering ansychronous programming and arrow functions.
A 5 question test on asynchronous programming.
This week covers CSS variables and accessibility and using the Lighthouse web scoring tools.
HTML and CSS - Week 6
A 3 question test is here.
Assignment: Use Lighthouse to generate an accessiblity report for your previously completed assignment from the last course. Achieve a 70% score or higher.
This week’s courses were released Tuesday, April 13. Any assignments will not be due for 1 week from your receiving them.
HTML & CSS - Week 5
This week covers forms, meta tags, tables, pseudo-selectors (CSS), and responsive design (changing the layout depending on screen size). You
will use GitHub Pages to put your assignments
on the web.
Week 5 HTML / CSS Walkthrough - 2 minutes
A 5 question test on meta tags.
A 6 question test on forms and input elements.
A 3 question test on tables.
A 4 question test on pseudo-selectors.
A 3 question test on responsive design.
Assignment 1: Implement the given design for desktop and mobile sites. Submit your work as a GitHub repository and served using GitHub Pages.
Assignment 2: Implement the given mobile form. Submit via GitHub pages as well.
There will be a live class on Thursday, April 15th 3pm PDT (6pm EDT) with @Jimi.
References:
HTML & CSS - Week 4 In our last HTML & CSS course, we started with the basics of HTML and CSS, and practiced creating a simple webpage.
This week, we would be going deeper into Semantic Markup and Accessibility in HTML, as well as studying CSS Layouts, Cross-browser compatibility and CSS selectors.
A 7 question test is here.
A 5 questions test is here.
Assignments:
Suplemental References
Note from Mike: Please do be sure to give enough attention to last week’s HTML and CSS Introduction. It is a core part of your understanding. I recommend completing that before tackling Git or JavaScript this week - it’s really the most important foundation for your training. The Google Home page assignment from that course will be due this week.
Introduction to JavaScript Syntax
This week’s course explains some of the basics of JavaScript. There are
two in-line tests, and two assesments to complete at the end.
Supplemental Content
Here’s a really nice github cheat sheet you should keep by your computer when using git.
Mike created a couple of videos demonstrating Git and GitHub if you are still feeling unsure about it.
Git Demo - 28 minutes - Walk through creating a GitHub account, making a repo on GitHub, and doing some commands on the command line to update it.
Git Demo Office Hours - 45 minutes - Going through the excercise of connecting to the same repository on github and making and merging two branches.
This week participants begin working with the Learning Managment System (LMS).
Introduction to HTML and CSS.
This course teaches you to set up your development environment,
learn basic HTML and CSS syntax, and explains some best practices.
<html>, <head>, <body>, <title>, <p>
<h1> .. <h6>, <p>, <hr>, <a>, <ul>, <ol>, <li>, <img>, <div>, <span>
and attributes id, class, style
<a>
tag and the href
attribute.<ol>, <ul>, <li>
and style list-style-type
.<img>
tag and the src, width, style and alt
attributes. The CSS float
property is introduced.<style> and <link>
tags and the rel
attribute. The <script>
tag is mentioned for inserting inline JavaScript.class
attributes.class
and id
HTML attributes.<input>
tag and using the :link, :visited, :target, :active, :hover, and :focus
pseudo-classes.`Resource referenced include:
Assignment: Recreate the Google Home page (visual look). DEADLINE EXTENDED - since this course was not released until mid-week, the deadline for completion will be next week.
Setup for JavaScript This course simply asks you to install Node.js on your computer and report which version you have running.