Hi, I'm Sam!
I recently started Flatiron's Software Engineering bootcamp, and I love it. When thinking about what to include in a blog post (my first ever!), I know that it's important to include new concepts I've learned. I also know that no matter what I'm doing, the output is infinitely better if I approach it with authenticity. So, I'm going to start with how welcoming this community has been, and then I'll get into a handful of delightful CSS lessons I've learned.
Starting my SE Adventure
When I first mentioned an interest in software engineering to a real engineer, it was an off-hand comment. We were just chatting (one of those get-to-know-you coffees, which can be either fun or grueling, depending on everyone's energy) and she was so supportive of my learning more about this entire field. She recommended Codecademy, and I loved it, but knew I needed more structure if I really wanted to dive in. Over the next few months, I talked to more developers. Without fail, they were all incredibly enthusiastic about talking to (and sharing knowledge with) a coding newbie.
One of them sent a TON of resources – from YouTube videos to conferences to a list of bootcamps. He's checked in consistently, and has been a huge champion of my becoming a developer. Another set up a handful of meetings with me to start teaching me some key concepts (it was very helpful to have some background on arrays before I started bootcamp). Another, just as he found out I was leaving my job to start this bootcamp, set up time to talk through our company's codebase as a real-world example of some of the concepts I'd be learning. There have been so many people who are enthusiastic, helpful, and eager to share their experience as I make this transition.
I thoroughly underestimated the kindness of the software engineering community and just how excited they would be to have a new member. One of the best lessons I've learned is that community is a key element of this field – from sharing helpful resources to helping others troubleshoot to welcoming new developers with open arms (and open source).
CSS
Two other students from my cohort and I have been working on our first project together. We've created a page that returns recipes based on seasonal items from the farmers market. It's a good idea (if I do say so myself), but without CSS it's a bit... meh.
The CSS portion of this project was one of the parts I was a bit nervous about. I had less experience with CSS and it felt overwhelming to try to transform a simple page of lists and divs and headers into something pretty, user-friendly, and readable.
Another key lesson in this experience has been to take a breath and break down whatever I'm working on into smaller, manageable sections. So, I started by tackling the part by which I was most intimidated – how to get four lists (one for each season) to display side-by-side. After some googling and experimenting, I got the grid layout set up correctly.
Once I realized that CSS was actually fun – like an art project but my hands won't get covered in glue and I won't step on a runaway rhinestone – I started to enjoy myself. Below are some of my favorite bits of CSS that I learned throughout this project.
Grid layouts: grid layouts not only allow you to divide your page and its content into sections using HTML primitives, but they also enable you to have overlapping/layered elements. See the Mozilla link above for more information!
Underlines: I didn't realize there were so many creative ways to underline your text. I really get a kick out of the wavy underline (
text-decoration-line:underline; text-decoration-style: wavy;
). In looking up different types of underlines, I found some real gems. Underlines that look like they were drawn by marker, or ones that are animated, or ones that consist of a row of little hearts.Boxes: the same way I underestimated the amount of pizzazz in underlines, I was unprepared for all of the different box-shadow options. This was where the full power and nuance of CSS really clicked for me. I have a lot to learn, but it's really helpful to have a visual representation of how many options there are – that's why I loved the page of box-shadow examples I linked above. Who knew there were so many different ways to style a box?! You can click on any of those box-shadow examples to copy the code and then easily add those boxes to your own CSS files. This goes back to community – how cool that there are so many resources that allow you to share and implement other people's code!
I love the immediacy of this work – you change the background color in your file and you can see it change in your browser after a quick refresh. You set up a grid layout and you know almost instantly if it's working as it should. You edit your JS file to clean it up for readability and – wait – you ordered your functions and variables incorrectly (you can't use your form event listener before you've declared all the variables it involves!). A quick fix to the order of those functions and variables in your index.js, and now your code is both organized and working.
I'm looking forward to challenging myself and finding my voice as a software engineer – identifying which areas I'm passionate about and which languages speak to me the most. I am really grateful to be part of this community and can't wait to see where this adventure takes me.
Top comments (3)
This post is amazing!!
I think it would bring a lot of value to the CodeNewbie Community too:
CodeNewbie Community 🌱
The most supportive community of programmers and people learning to code.
The CodeNewbie Community is a super supportive & inclusive community of folks from all backgrounds who have gathered together to learn (and help others learn) to code. It's not unlike DEV, but the focus is really on dev newbies! 💻
Would you consider crossposting this article there? Because CodeNewbie is built on the same platform as DEV (Forem) you can fairly easily copy the Markdown and post it there as well. 😁
Hi Sam 👋,
Once more, welcome to the Community.
The field of software engineering, particularly web development, has existed since the inception of the internet. Many experts in the field can provide a wealth of information to help you master it. I had a tonne of materials available when I first started this, and I didn't know which ones to use and which ones to put on the back burner. I've learned the hard way that tutorial hell may be really risky, particularly if you don't participate in real-world initiatives.
freecodecamp saved me for myself; I heartily suggest it. It periodically provides tasks that let you apply what you've learned to real-world situations.
Last but not least, best wishes for your journey in this wonderful realm of software engineering.
That was a nice read! Liked, bookmarked and followed, keep the good work!