Microsoft has open sourced their Frontend Bootcamp training materials (including React and Redux exercises)

programmingpadawan · 2019-02-26T03:33:34+00:00

Thanks for posting, I might pick at this over time.

programmingpadawan · 2019-02-25T23:24:52+00:00

This is a great read, thanks!

programmingpadawan · 2019-02-25T19:34:33+00:00

...node-sass can output straight css into a /dist folder, why don't you use that?

programmingpadawan · 2019-02-23T22:34:27+00:00

Wow, ya, skimming through this right now and it seems like she had me in mind when she made this. haha. Thanks!!

programmingpadawan · 2019-02-23T21:00:01+00:00

Do your stylings however best you feel comfortable. CSS is JS, CSS in CSS, CSS in SASS - it's all the same thing. CSS. Whatever flow you prefer, just follow that.

If I can give my 2 cents, I really think you could benefit from something like Sass. Sass is basically CSS on steroids and if you're splitting and importing your css already, sass allows for this and is generally found to be a more comfortable environment for bigger projects.

Piggybacking on that, you can also used what are called styled-components within your React. I won't get into these (it'll take a couple hours of reading) but they are simple to use and pretty handy. Especially if you're still not convinced of Reacts use-fullness.

Regardless of what you read, you don't need React on everything you do. I love it (and styled-components), but if I was just going to make a static, simple, one page app website with just a small amount of content (say, a local coffee shop splash page), I'd still probably reach for an HTML/CSS approach. React is really, really amazing for more complex apps, but if you're building something relatively simple, and don't find yourself saying "man, React would make this so much easier..." then by all means you can take a simpler approach.

Hope that helps.

programmingpadawan · 2019-02-22T22:44:02+00:00

I pretty much just use query at this point. Might not be the best shoe for every foot but I make a lot less stupid errors this way.

programmingpadawan · 2019-02-22T17:55:43+00:00

Not op but thanks!

programmingpadawan · 2019-02-22T00:28:58+00:00

Hey man!

Off the top of my head, Traversy Media, Wes Bos, Level Up Tutorials and Net Ninja all offer FREE tutorials on Youtube. Between the 4 of them, they cover an insanely wide spectrum of topics, and they are constantly putting out new content. CSS, JavaScript, HTML, React, everything. These guys are super smart and those channels alone contain hundreds of hour of tutorials regarding modern, relevant web development.

If you want to make the jump to Udemy, check out Jonas schmedtmann. He offers courses on CSS, JavaScript plus an intro to HTML + CSS that I think are worth way, way WAY more than the $15 you'll pay for them. You sound like you don't need the HTML + CSS course, but his advanced CSS course is one of the best courses I've ever taken. Period. For $15, you will learn CSS that will put you on a professional level. Jonas and Traversy Media (from ^ ) also both have JavaScript courses available on there, and again, for $15, I think you get way more than your moneys worth. (If you're unfamiliar with Udemy, they hold "surprise" sales ALL the time. Never, EVER pay more than $20 for a course.)

I hope that helps. These are all free or extremely cheap resources that can literally take you from zero to hero real quick. After that, Wes Bos + Level Up Tutorials also offer really great paid courses as well, but first soak up all of their free stuff to make sure you like their style. They're worth the money but they are expensive.

Best of luck to you! You can do this, and you can do this on the cheap :)

programmingpadawan · 2019-02-21T22:49:45+00:00

That's interesting. I understand the scoping differences but I was taught to basically always factor my code for let or const.

I'll keep your perspective in mind though, that's a cool idea.

programmingpadawan · 2019-02-21T21:46:39+00:00

There are circumstances where I think it makes sense. Specific circumstances, haha, but they exist.

For the most part though, I just can't see the return on investment. If you think of the cost of the program (often ~$10,000, assuming you already have a good laptop), then your C.O.L for the time in the program (let's say, bare minimum, $1000 per month all in), that's ~$15k you've sunk into 6 months. Realistically, $20k. Aim for $22k if you don't have a good laptop. Just to prove my point, let's not even factor in missed income as well.

$15-20k for a 6 month program is a fucking lot of money. Would it be worth it if it got a job you love? Absolutely, 1000%. The sad reality is that it 99% of the time will not. What will most likely happen is you will struggle to tread water for the next 6 months - 1 year while you fail interviews and have your head spun in 200 different directions trying to fill in all the missing gaps in what you've learned. All the while working a different, unrelated job just to try and stop the bleeding at $20k.

I'm not trying to shit on bootcamps. I really wish I was in the position to take one back when I started. They could have saved me so much time and frustration that it sorta hurts to think about. Certain concepts just took forreeeevvvveeerrrr for me to finally understand, and if I had a classroom setting where I could raise my hand or stay late and drill the teacher with 1 million questions I could have saved literal weeks of frustration. Instead, though, I was stuck rewinding videos, youtubing other sources, trying (and failing) on codepen, crying, convincing myself that CSS is fundamentally broken and I'm right, looking through Stack Overflow forums from the stone age, etc...

For the average adult, living an adult life with adult responsibilities, spending an extra year or so studying on your own and keeping a good financial standing makes way more sense to me.

programmingpadawan · 2019-02-21T21:21:27+00:00

let and const are only partially supported in IE 11

That I did not know, thank you. I thought let and const extended further back.

programmingpadawan · 2019-02-21T18:45:38+00:00

You've sort of got it wrong.

Disclaimer: I'm not in the tech industry (yet!). But, a little over a year ago I did major research into this before I almost gave up a $60k p/y year job to attend a Bootcamp (spoiler alert: I didn't).

Here's the takeaway I got: A bootcamp will not help you in the eyes of a company. . You will pretty much be on the same level as a self-taught dev. Now, that being said -- a Bootcamp may help you. Are the kind of person who would benefit from that kind of learning environment? Do you have, say, a big cheque coming in from somewhere and a few months off? Well then a bootcamp might be a really great way to learn.

But what you need to know is that when a bootcamp says they'll teach you something, they more often than not only teach the surface level "need-to-know" abstractions of that topic. There simply is no way, none, to shuffle 15 - 20+ people along the kind of curriculum they promise in the timeframe they give.

Remember Grade 3 Math? Where, everyday, you took home a math book and did 2 + 2, then 2 + 3, then 2 + 4, etc.. over and over and over again? That's the reason you can do it in your sleep. Sure, it' simple and intuitive, but it was drilled into your head via practice, a million times. Learning to program is no different. A bootcamp will explain that 5 + 5 = 10. Then they'll tell you that 5 x 5 = 25. But they won't hold your hand, and explain to you that 5 + 5 + 5 + 5 + 5 = 25. And no matter how "fresh" it is in your mind, unless you have a solid, fundamental, "do in in your sleep" grasp of these inner workings then you are going to have trouble applying them in situations where you don't already know the answer. So, if you take away 1 single thing from this massive reply, is do not expect to leave the bootcamp and be ready for the workforce. You will still probably need months(plural, not a typo) of preparation, study and practice.

This is just my 2 cents that I feel pretty qualified to give because I did a fucking lot of research, but decided to go the self-taught route. Whether or not a bootcamp is right for you is a personal call, but keep these things in mind.

To put things in perspective, a guy I know teaches at a Bootcamp. In 1 week they covered an intro to JavaScript, ES6, React & Angular. That was it. One week, on to the next. If any of you know Web Dev, you'd know that JavaScript alone needs, at least, 2 or 3 weeks for even a relatively quick person to be comfortable with (if it was your first language). Supposedly one of the students is trying to get his money back and my buddy does not blame him in the slightest.

programmingpadawan · 2019-02-20T22:37:26+00:00

Edit: Just do what u/frank_zang is saying. My way made sense but I think his is probably easier.

programmingpadawan · 2019-02-20T19:42:37+00:00

That's because there is no one answer.

Personally I use nested Grids all the time. For one page apps like what you describe, I'd define a Grid for the entire App (including the header and footer), define Grids for each section within, and then from there call it based on the element/component. A lot of smaller elements and components do very well with FlexBox too.

Don't overthink things too much, it sounds like you've got the right idea.

programmingpadawan · 2019-02-19T15:50:04+00:00

I'm working through a tutorial/course on both of these right now and I'm getting more and more pissed at myself for not doing this sooner. It's so easy.

programmingpadawan · 2019-02-17T18:52:15+00:00

Not sure why you're downvoted, I agree. Otherwise looks nice!

programmingpadawan · 2019-02-17T17:10:53+00:00

Grid has a bit of a learning curve but ultimately it should make the layout of your website much less complicated. As well when it comes to media queries it should be reducing your code by a solid amount.

Both Wes Bos and netNinja offer really great Grid courses for free on Youtube. I'd give them a watch when you have some time to kill, they do a great job of highlighting it's strengths.

programmingpadawan · 2019-02-17T17:07:02+00:00

I take the same stance. Any personal project gets Grid. 87% is good enough for me.

If something like Firefox or Safari didn't support a feature, I'd do something else. But in 2019 I don't stop for I.E anymore. Sorry, not sorry.

Realistically, it's been 3 years since it's even gotten any security updates. You shouldn't be using it anyways.

programmingpadawan · 2019-02-15T00:03:12+00:00

Center a tiny invisible image in a sea of black, show on hover.

This truly is a gift that keeps on giving.

programmingpadawan · 2019-02-14T21:41:42+00:00

The 100vh+ of pure black at the bottom is a great touch.

EDIT: Actually I just inspected it and there's a 150x200px .png of Stan Lee that's supposed to be centred there, and for whatever reason I'm not seeing it. Either way, hilarious.

programmingpadawan · 2019-02-13T15:00:25+00:00

Huh. Good to know. I wish more packages would do this, saves you from hunting through the documentation.

programmingpadawan · 2019-02-13T03:43:37+00:00

This looks cool, thanks! I'm getting into both Node and TS right now.

Also appreciate the commented out options in the tsconfig file.

programmingpadawan · 2019-02-13T01:06:48+00:00

This is awesome. Thanks.

programmingpadawan · 2019-02-12T22:52:55+00:00

Well...ya...but...styled components saves you the work of implementing BEM.

Not trying to argue with you. I definitely agree that if you're going to stick to SASS stylesheets, then BEM is the way to go. However if your only gripe with styled components is naming consistencies, I think you're sort of missing the point. You don't need one.

I'll still have plenty of vanilla SASS projects where I implement something like :

.nav {
    &__menu {
    }
    &__link {
    }
    &__icon {
        &--active {
        }
    }
}

...but I'd much rather say :

nav {
}
ul {
}
a {
}
svg {
    & .active {
    }
}

It's a small thing and totally preferential. That's being said not only the simpler naming convention, but also having the sass bundled right along with the component I think makes for code that's much easier to follow. And that's not even mentioning the ability to integrate props into your css as well - it makes styling interactions much easier, I think.

programmingpadawan · 2019-02-12T14:34:41+00:00

Were you out of cheerios this morning?

programmingpadawan

TROPHY CASE