Sprint 1
For this sprint, we are going to build on our previous knowledge of HTML, CSS, and Github to start to create a Github page that we will contribute to throughout this course.
Review Previous Class Assignment
- Why are side projects so important for developers?
- Is this something unique to web development?
- Is this attitude different than what you expected?
- How would you describe “Thinking like a Programmer?”
- What was one web design trend you would like to try out?
Making Time to Code
April is the CEO and Founder of Vogue & Code, an online resource for minorities in tech to explore the industry and find guidance on where to get started. Between running a business, working a full-time job, and various side-projects, she explains how she fits learning to code into her days in this video, Making Time to Code
Here’s what she recommended:
- Create a detailed schedule and stick to it
- Code before your other obligations start
- Try to sneak coding into smaller windows of availability, like lunch breaks
In-class Assignment
The goal of the in-class assignment is to bring clarity on using Markdown. We will also explore using Github to create pull requests and cover some best practices when developing code collaboratively.
Understanding Markdown -> HTML and CSS
Markdown is not HTML, but it is a syntax that translates to HTML. You cannot just view .md
files in the browser - there has to be a program to convert it into HTML that browsers can render.
Let’s try to convert the following markdown into HTML:
# Markdown Blog Post
I like using Markdown. It makes writing HTML so much easier!
**You can even use HTML in Markdown**, which is <em>really cool!</em>
I think I'll use it to format all of [my blog posts](../blog) from now on. However, I've discovered there are a few things to look out for.
![Screenshot of Markdown](./images/screenshot-of-markdown.png)
## Things to look out for
* Markdown is really good when I don't need to worry about styles
* When you want to add styles, you have to build a new compiler :(
* It's easy to make some small changes that don't work out well, like: ![Screenshot of Markdown] (./images/screenshot-of-markdown.png) doesn't work because it has an extra space in it!
* You have to have a special plug in to see what it's going to look like locally
Remember to checkout this [Markdown guide](https://www.markdownguide.org/basic-syntax/) if you need help figuring out how to do something. It's really helpful!
[View more posts](../blog)
- What is Markdown?
- How does Markdown get converted?
- What is Markdown good for? What are some times when it would be better to write HTML?
At-home Assignment
HTML Best Practices
CSS Naming Conventions and Best Practives
Web Design Page Layouts
- Beginning Graphic Design: Layout & Composition
- The Law of Similarity - Gestalt Principles
- The Building Blocks of Visual Design
Writing Prompt
What are your thoughts on the homework material? Think about:
- What are the benefits of using HTML best practices?
- What does BEM stand for? How does the naming convention differ from how you have written class names before?
- Does web design differ from other forms of design?
- What is Gestalt? What are all the ways to use the Law of Similarity to group objects?