Skip to main content

Week2

Day 8

Hello, last week you got quite a bit of knowledge on Javascript. You guys have worked hard and created amazing builds of the Quiz. 🎆 If you're still building, no worries, the thread to share your builds will be kept active. But what I would suggest is to maybe push out a basic version first. And then subsequently you can continue to work on it.

This week, we are now moving on to learn about Cascading Style Sheets (CSS) and the design of web pages 🎨 . We've got quite a number of folks here who said that they felt they could improve their design sense, and I've specially curated these resources for you guys. So please enjoy! 🧑‍🎨

Today's article covers:

  1. the history of CSS.
  2. discusses the history of layouts in CSS, from table layout -> float-based layout -> flexbox layout / grid layout.
  3. also covers the use of CSS preprocessors and postprocessors.
  4. I thought the part on CSS postprocessors was pretty useful, because while inspecting some sites' stylesheet, you might have noticed the -webkit prefix and wondered about what it is.

Article

Share your thoughts after reading the article.

  • Were there new things you learnt from this article?
  • Were there parts that you didn't understand too well and might be googling to find out more?

Day 9

Hello, for this week's challenge, you have the option to build:

1⃣ A Product Landing Page (you can decide what product you want to feature - it can be something you like)

2⃣ A Personal Portfolio Site (so that you can feature your JS Quiz in it) Let's try to complete this by Sunday! So you have about 5 days!

If you are not familiar with creating a landing page, here's two tutorials that you can follow along:

➡️ Create one using Canva (no coding but assumes you know Canva): Landing page with canva .

➡️ With HTML and CSS:.

For building a portfolio website, here's one by freeCodeCamp. Watch until 2:08:44. It's a pretty long video, so maybe split up the coding into 4 days. Landing Page

As usual feel free to share your buildings...

Day10

Hello, help is here for you guys to design a website!

In this 11-minute video, learn about three different web design principles:

  1. navigation 🧭

  2. hierarchy

  3. color 🎨 !

    Hopefully from this video you will be able to use these principles when designing your website.

Article

  • Do you know of any websites which make good use of any of these three principles? Share the link here.
  • Which of these principles will you pay special attention to when designing your website?

Day11

Hello! Here's another resource to help you with your design sense as you design your portfolio site or landing page! Today's reading will take about 5 minutes of your time, and is about the principles of spacing, contrast, and uniformity. Using 10 examples, the author illustrates to you the importance of following these three principles in designing your webpages.

Article

After reading this article, share with us which principle you want to start applying in your site. Or, if this is not new to you, do you know of a webpage you can show off that illustrates these principles?

pssst... I hear that we might be looking for Stackies who are more experienced in web development to mentor less experienced Stackies... more details to come soon 🤐

Day12

Hello, for today we will be listening to a 10-minute podcast. You would notice that developers in general have a Twitter account. Why is it important for developers to have a Twitter account and how can it help you in your role? This podcast will share some of the benefits of having a Twitter account and how it can help you in your journey.

Podcast

One of the things mentioned by Randall was that she had to establish credibility and visibility in the Twitterverse. What could be one thing you can do to increase your credibility as a web developer?

Also, since we talked about growing our following on Twitter, a thread is now created. Feel free to post your Twitter accounts in the thread, so that your fellow Web Dev Stackies can follow you!

Day 13

Hello folks! Today we will be watching a 19-minute video called "The State of CSS". The State of CSS pretty much discusses some of the newest developments in CSS each year. It is something you would want to look out for if you are very much into frontend design or are simply looking out for something trendy to add to your site. If you are interested, you can search up the term "State of CSS" to see the developments from the past years.

  • Which new development got you the most excited?

  • If you are trying out any new properties, do take a screenshot and share what you've tried!

Day 14

Hello folks, we have reached the end of the second week of 30DaysofWeb2! 🚀 You've read so much and hopefully built a landing page / portfolio site in the past 6 days. Now, time to test your knowledge with a quiz!

Let's see how you fare in this quiz! React with your score once you're done with the quiz!