Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialSaqib Ishfaq
13,912 Pointsplease HELP! this is going way over my head:/
// media queries
@mixin mq($break) { $value: map-get($breakpoints, $break); $sml : map-get($breakpoints, 'sml');
@if $value < $sml {
@media (max-width: $value){
@content;
}
}
@else {
@media (min-width: $value){
@content;
}
}
}
Saqib Ishfaq
13,912 PointsMakes sense ! Yeah I just somehow finished the basics course with little knowledge of how sass work and its basis ! Hope it's enough for now and will come back to it may be later ,once Iam confident enough with what little I have learned so far going through this basics course !
Nathan Meloul
2,882 PointsWhy do we need the if else statement? The $value should be the correct value for whatever size string it receives, and that should set the content.
11 Answers
Roald Jurrian Kamman
Front End Web Development Techdegree Graduate 15,544 PointsThank god I'm not the only one breaking my brain on this stuff. Spent a good day trying to understand what's going on in the last 5-10 videos. I went for several walks to try and process the information and every time I get back I'm overwhelmed with another weird calculational displacement that's somehow supposed to make life easier.
Michael Kalmykov
8,919 PointsJust piling on here that while this is cool, it's largely impractical and overly engineered.
Junior Aidee
Front End Web Development Techdegree Graduate 14,657 PointsI echo the sentiment that is shared in this forum. I'm glad I'm not the only one.
Roald Jurrian Kamman
Front End Web Development Techdegree Graduate 15,544 PointsHey everyone, I posted here Nov 14, 2019. I have since gone full-stack, built multiple projects and websites, and niched down to Shopify development. Don't worry if you're not getting SCSS or any of this overcomplicated stuff. I have not used it in my career so far and don't see myself ever using it beyond copy pasting a specific thing I want to do. But I don't need to understand it to copy paste it... Shopify also moved to remove SCSS and went back to regular plain CSS because it's faster client side. Maybe harder to navigate but if you know how to use ctrl + f correctly and can find class names with dev tools you won't really need a super read friendly file when you're working on any project. You can also use !important if you can't find what's overriding your styles.
TLDR: Focus on understanding code logic and dataflow instead of weird tricks you will never use. Code is hard enough as it is, don't make it harder than it has to be.
Wasiu Hammed
Front End Web Development Techdegree Student 7,792 PointsThis makes my day!
Pedro Miranda
Front End Web Development Techdegree Student 7,505 PointsDitto. It's all too much at once, there should be more room to experiment between the leap in sass lessons via course projects. It feels like its trying to shove you shortcuts for everything that took 4 courses to learn, into ONE course. Pretty unrealistic in my opinion. Its an entirely different language, we need to be able to practice certain aspects at length first before jumping into deeper layers, it feels like codeception when they try to tell you how to write the shortcut to the shortcut to the shortcut you just (hopefully) learned 20 minutes ago.
Pedro Miranda
Front End Web Development Techdegree Student 7,505 PointsThere needs to be a side by side panel for this lesson, is what keeps coming back to my head. The values he's trying to call up seem to be in the other file but we can't make the connections while he's talking about what they do/call up because we can't see that specific information while he's explaining. We can only see the values when we rewind, but then we can't see the strings that call them up. It just makes connecting the two very hard when they are not both present on the same screen or being toggled to and from enough, like we're used to doing for HTML/CSS changes. He's just changing strings and we are just left to try and visualize what that change represents. That's a big shift to how we're used to absorbing the information up to this point.
He does go back to the HTML file a fair bit though, but i think that's where another big issue is. The lesson shouldn't be "look, the html remains the same because I applied the shortcut correctly", it should be "Your HTML will remain the same because THIS is how we made sure to apply the shortcut correctly". The main focus should be on explaining sass more fundamentally, not the impact on the HTML file, we already know that all we're trying to do is make sure the HTML appearance in unchanged.
Nassima ANANI
Front End Web Development Techdegree Graduate 16,780 Pointssame here, my mind is overwhelmed with all this stuff!! it is clearly an advanced level of sass
David Holt
8,441 PointsWhew! I have been at this for a few days re-watching videos and have came to the exact same conclusion as all of you! It is way too intense and complicated at this level in the game. I completely broke my page trying to keep up.
Skyler Harris
7,670 PointsGlad it wasn't just me. Spent weeks on this. But I think for many of us this is also our first introduction to variables, strings, if/else statements, @for loops and @each loops so it seems daunting! Good luck everyone, you can do it!
Wasiu Hammed
Front End Web Development Techdegree Student 7,792 PointsThanks, everybody, for the comments. Reading the comments tells me "you're not alone" and reinvigorates my "wants to do more." That being said, as a teacher and a content developer myself, I think the title of this unit is misleading (SASS Basis), and the presentation is confusing. Here are my suggestions:
This lesson should come after a good foundation of JavaScript. Weirdly, someone new to HTML and CSS should jump into learning SASS at this level. SCSS grid should be moved here and SASS in the place of the CSS grid.
The way the presenter is changing things is not comfortable. When you are happy that you've grabbed a lesson, the lesson that comes after will erase all that you understood with a new "jargon." There should be a specific implementation for each newly introduced concept without erasing the old idea.
At the end of the whole lesson, there should be a walkthrough project that teaches implementing most of the valuable parts of the lesson.
Thanks.
Gavin Johnston
9,107 PointsEchoing the sentiment of everyone else here, the entire 4th part of the Sass Basics course seems like a massive leap to the rest of the course and seems quite out of place. Even more confusing was Guil calling variables stored in different files I didnt even know were there? It was all very deflating, I've decided to give up on part 4 and go to udemy for more sass related stuff.
Matt Jones
18,747 PointsGlad to read these comments...was thinking that it all seemed a little overly complex for a basics course!
bill curry
Front End Web Development Techdegree Student 7,841 Pointsbill curry
Front End Web Development Techdegree Student 7,841 PointsHI Saqib, I just watched this video, too (two different times). This last bit on mapping the media query values seemed a bit overkill and overly complex. Kind of like a Rube Goldberg device. Guil is obviously a sass and css master. While a lot of this sass stuff will save you time w/your CSS, you're not expected to incorporate all these complex sass methods. Start off basic w/your project 5 and only try using things you understand (variables, mixins, maybe some color functions). This method for mapping media queries was too complex for me, so for now, I'll just stick with trying to use variables for different breakpoints. Hope that helps.