I continued working on the Airbnb React project. I added Sass with CSS modules and I can’t lie, it feels pretty good. The only thing that I have an interest in is relative paths so that I can easily reference the root/global theme files from any component. Other than that I am really happy about my styling setup. Step by step I am improving on my own processes. The competition with the man in the mirror is heating up. I’m hyped!

TLDR;

Okay, so here are the highlights of what I did:

• CSS -> Reviewed some of the Sass documentation on @mixins and @use. I remember when I first learned how to use them and struggled so much. It felt great coming back and knocking them out so quickly.
• Practice -> Continued working on the Airbnb Experiences project from the React tutorial course. I just have a tiny bit left but I couldn’t finish today. I’ll wrap it up tomorrow and get going with the next one. I want to finish this tutorial and all the projects ASAP. I would skip them but I really feel like I need to practice discipline and earn my progress step by step.

Using Modules and importing with @use

The app.scss file:

$theme_white: #ffffff;

The file that imports the module using the @use rule:

@use "./app"; /*This is relative so you may need to adjust depending on file structure */

.app {
  min-height: 500px;
  min-width: 500px;
  background: app.$theme_white;

  h1 {
    font-family: "Poppins", sans-serif;
  }
}

This is the default usage where the file name is used as the default namespace for all the variables. We can also change the namespace:

@use "./app" as theme;

.app {
  min-height: 500px;
  min-width: 500px;
  background: theme.$theme_white;
}

Or we can remove the namespace altogether by changing the namespace to *:

@use "./app" as *;

.app {
  min-height: 500px;
  min-width: 500px;
  background: $theme_white;
}

Goal For Round 7 of the #100DaysofCode Challenge

This is my seventh round of the “#100daysofcode” challenge. I will be continuing my work from round five and round six into round seven. I am currently working through the book “Cracking the Coding Interview” by Gayle Laakmann McDowell. My goal is to become more familiar with algorithms and data structures. This goal was derived from my goal to better understand operating systems and key programs that I use in the terminal regularly e.g. Git. This goal was in turn derived from my desire to better understand the fundamental tools used for coding outside of popular GUIs. This in turn was derived from my desire to be a better back-end developer.

I have no idea if my path is correct but I am walking down this road anyways. Worst case scenario I learn a whole bunch of stuff that will help me out on my own personal projects.