CodeNewbie Community ๐ŸŒฑ

Cover image for From Front Desk to Front End p.2
Tauri StClaire
Tauri StClaire

Posted on • Updated on

From Front Desk to Front End p.2

So most of this past week has been committed to completing the last Guided Project in the Responsive Coding class I am doing at with Skillcrush.
You can follow everything I've done here on my github in a much more condensed form obv., and here it is rendered by GH pages.

Next week I'll start adding additional content about my program, my daily schedule, etc. ๐Ÿ˜


I went over the solution code for this challenge and compared to what I had decided for the mobile styles.
What I learned:

  • I repeated myself too much in areas that could be brought to global styles.
  • Learned how to make a div by just making a colored space between sections!
  • I got some ideas for how to make the margins and padding work but ultimately stuck by my own decisions in some areas, we'll see if that continues to play out. V hot today ๐Ÿ˜Ž

I began styling the Tablet styles, which is always p disheartening bc formatting always looks bad at first then better as you edit.
๐ŸŽง Flow Jams: More Alcest
๐ŸŒบ Destress Activity: Night walk with my partner and neck massages. I also did a five min faceplant on the bed bc sometimes that's what you need

tablet styles looking bad


I added the basic layouts via media inquiries for the tablet and desktop following along with the lessons in Skillcrush. Then I finished the lessons on responsive images and iframes by creating the sizing for the tablet and desktops. Anyone following along with Skillcrush lessons will realize I jumped around and I added the font styling, background and images FIRST then went through all of the lessons regarding the mobile styles and finalized by going through for mobile and tablets.

I've always liked to add colors and fun things ASAP! It keeps my focus better. I used to choose the silliest (readable) font and bright colors for my essays in college just to make it that much more entertaining for myself.

There's a few flexbox areas that are giving me flack, but everything is shaping up and I'm getting to the point of squint-and-tweak for the remaining margins and padding! ๐Ÿ’ช
I still need to understand where to use flex-basis vs. width more and have highlighted that in my CSS to look into.
๐ŸŽง Flow Jams: Magma
๐ŸŒบ [forgot to input!]

Flexbox not working for me on features section


I was able to fix of the few silly sections myself, but ultimately pulled out the solution code from a later point now that I am in the last stretch for a number I was still stuck on. I quickly learned to pay more attention to my HTML and how my divs were arranged (of course), and renamed some sections where the solution was much clearer. I was able to further fix a few sections on my own just by refocusing that way. Looking good!!
Then my footer social icons disappeared after I made all of the footers uniformly beautiful, whyyyyy? Oh, my internet went suddenly down and they are linking from font awesome... Thank goodness... Sometimes computers make more sense than humans, but sometimes it's easy to characterize them as mischievous. ๐Ÿ’ป
Oh, it's looking so good! Wait, what is that sudden blank space...

weird blank space

I'll come back to this with a fresh brain after the holiday for final wrap up right on sched!
๐ŸŽง Flow Jams: Emancipator
๐ŸŒบ Destress Activity: : ๐ŸŽฎ Hollowknight


Happy Holiday! ๐Ÿ‡บ๐Ÿ‡ธ


I kept chipping away at tweaking the Unplugged project, but am not making good progress on my remaining problem areas. So I wrote some specific questions to an instructor at Skillcrush and scheduled a Q&A for Friday. In the mean time to give my brain a switch-up I started new challenge which is v exciting, I put down the HTML skeleton today and introduced myself to the Front End Mentor community! This is the challenge I'm doing.
Edited to add later: I also realized something VERY IMPORTANT missing from my regular workflow!!! I don't think I've done a great job at ensuring I ALWAYS do my initial commit to exercises or projects BEFORE starting them. ): For my projects I coded everything so while lame is eh ok, but mostly I am bummed that the exercises I have been pushing are not as good a record of my individual efforts. Lesson learned!
๐ŸŽง Flow Jams: Erykah Badu
๐ŸŒบ Destress Activity: Just workout today ๐Ÿ’ช

website no styles just content

Top comments (5)

dennistobar profile image
Dennis Tobar

Hey, nice update!

After seeing your blank space at the bottom, I just remembered why I don't like CSS and to be a frontend developer ;)

Good luck with the new challenge with three columns grid.

taurist profile image
Tauri StClaire • Edited

๐Ÿ˜‚ Lol! It does have its challenges! But I know that I must really like front end when I'm EXCITED to try it out again the next day after simmering on some ideas!

I'm sure writing in JS, PHP and Python come with their own challenges too, right? {:

dennistobar profile image
Dennis Tobar

All areas (backend, frontend, SRE, etc.) have their challenges: when you do backend developments, you should optimize the routines to put the data to other or next stage (i.e., a React SPA or app, using JSON, or XML to another kind of system)

mckennabramble profile image
McKenna Bramble

Hi Tauri! I love Hollowknight! Personally, I have been burning through Pokemon Sword & Shield to destress :)

taurist profile image
Tauri StClaire

I love Pokemon! I am kinda a curmudgeon when it comes to the newer game dynamics, but my girlfriend and I did check out Sword/Shield when it came out and I'm excited to see where these 3D versions are going {: