In this blog post, I want to talk about everything I learned while studying at WGU last year. Some of it I learned on my own, but most of it was thanks to the courses I took as part of my degree program, all of which I passed.
I will start with what I consider to be the most important bits.
Web Design Principles
I didn’t think I would need to learn anything related to design or art in order to develop for the web. After all, web development is just programming, right? Well, it turns out that there is a little more to it than that. Color theory and typography play a huge role in how people perceive websites and UI’s, and we have to think about those things to create the best experience for users. Therefore, we need to learn about design principles when it comes to web development.
Any web app is going to need an interface. Most of the time, companies will have a dedicated team of UI/UX designers specifically for creating the layout of their app. However, if you’re just starting out, you’re going to be the one designing the interface for your first app project. Learning how to build an interface is essential as a developer. If your app is going to run on the web, there are a few things that you need to know about how to design an interface.
I searched online and I was able to find a lot of helpful resources. One of the videos I watched (see above) gave me the confidence to try designing my own website. My first website was not the greatest, mind you, but it had a working layout made with HTML and CSS. The video above is essentially a whole class about designing things specifically for the web. It is intended for absolute beginners. If you’re just starting out, check it out!
With the video by envato tuts+, I learned about:
- Project briefs
- A document that outlines the goals, scope, and requirements of a web design project.
- Wireframes
- A visual representation of the website’s layout and structure, without the styling.
- Color theory
- Color theory is the creative and scientific use of color. It’s a system of logic that places guidelines and rules of how colors contrast, mix, and match with each other.
- Figma, an interface design tool used for prototyping
- Figma is a cloud-based design tool used for creating user interfaces, prototypes, and collaborative design projects. It allows designers and teams to work together in real-time, making it easy to share and iterate on designs.
- Sketching
- Bootstrap
- Semantic HTML
I had a blast learning all of this. The one thing that really made my experience worthwhile was that I could go back and review each topic in the video at any time. Each topic is split into segments on the YouTube playback bar and everything is well organized. You can click on the specific segment in the video to the topic you want to revisit.
Mastering CSS In 2 Weeks
After designing my first (and rather simple) website, I knew I had gotten the hang of HTML easily enough. However, even though I’d used CSS to style my website, I wasn’t comfortable using it for responsive design, which is what I ultimately wanted.
Responsive design is coding a web page so that the layout responds to the width of the screen. This is important for mobile users, since you may have a wide layout on a desktop, but when the user shrinks the width of their browser (or their device has a small screen), you want the website to accommodate them and adapt the content accordingly.
For responsive design, you need to learn aspects of CSS such as:
- Responsive Typography
- Relative Units
- Media Queries
- Flexbox & Grid
- Browser Viewport Units
In today’s world where devices have varying screen sizes, it is important that a website is designed with adaptability in mind. It should look good on any device, regardless of how wide its screen is.
So for two weeks, I spent about 10-12 hours per day, every day, studying CSS and responsive design. I read the W3C School’s tutorials on CSS, and read the material from WGU, over and over. What really helped me, though, was a guy by the name of Kevin Powell.
Kevin Powell’s YouTube videos are short but straight-to-the-point, which I like. His channel’s main goal is to educate viewers on how to use CSS in fun and creative ways. Not only did I use his videos to learn more about responsive web design, but I also signed up to his “Conquering Responsive Layouts” course to apply my knowledge using his assignments.
Using his interactive course, I was able to conquer Flexbox and understand how one could use it for creating responsive containers. It was a little tricky to understand at first, but I got up every morning and re-did the assignments until I got it absorbed in my head.
I also learned about relative units, which he recommends using most of the time when creating layouts, and responsive typography, among other things. To sign up to his course, it is completely free. If you’re interested, you can use this link to access the course.
Python
After having successfully learned CSS to create responsive layouts, I was ready to move on to bigger and better things.
It was around this time that my first programming course at WGU was starting. This course delved into Python, a popular and powerful programming language used in everything from small scripting projects to major software products.
The first part of the course dealt with Python’s basic syntax and its most important data structures. This meant that for the next several days, I studied everything from simple variables and conditional logic, to the all-important loops (for and while).
One of the most interesting concepts I learned is the so-called “duck rule” or the “rubber duck test.” I thought it was a joke but no, it’s real. It’s a bit of computer science humor, and it says that if you’re having a problem, just talk to a rubber duck. If your problem isn’t solved, you aren’t done talking to the rubber duck.
The idea is that when a programmer needs to debug their code, they should explain the program line-by-line to a rubber duck. Often, the act of explaining the problem step by step will cause the solution to present itself. The phrase comes from the old-time programmers who would sit in front of their monitors and talk to themselves while figuring out how to make the code work.
The second part of the course covered classes and modules, which were all new to me. Classes are blueprints, or patterns, for building objects, which are the runtime entities that you use in your programs. A module is a collection of functions, variables, and classes used by your program. This part of the course was a lot of fun, as it opened up a new world of possibilities and introduced me to a whole new group of programming techniques.
The third part of the course was intended to be a bit more practical. We were told that we would use the skills we gained in the first half of the course to create a simple program to take the average of several numbers. We also learned how to import functions from a simple Math module and how to accept user input.
I have written about Python in great detail in the posts listed below.
- Basics of Python Programming
- Basics of Python Programming, Pt. II
- Basics of Python Programming, Pt. III
- Passed Introduction to Programming in Python (D335)
Front-End Web Development
This course at WGU taught me how to sketch a layout for a website and create a wireframe as a prototype before even touching the code. It also helped me realize that I needed a little more work on my Photoshop skills and got me using some tools like Adobe XD. This is the course where I really polished my responsive design and CSS skills, as well as started to learn some of the more modern stylistic choices when creating sites.
By the time I was taking this course, I already knew HTML/CSS and had a bit of experience with responsive design. I just needed to refresh my memory and brush up on the fundamentals. This course helped me do that. It was a great refresher and the projects really helped me understand all the different ways the same site could look and function, all while learning a bit more about how to design it.
For someone who has never touched HTML or CSS, this course might be a bit harder and will require a lot of studying and a little more time, but it is a great course to learn the basics. If you are a bit more advanced and already know how to build a simple website in HTML, then the second half of this course is pretty easy. You will breeze right past it.
The final project had students create a site about a US state of their choosing with data about a few of the state’s cities, such as population, region, and average income level compared to the rest of the state. That part was easy. Just had to research the stats online by looking at the census data. However, the main thing was to make the site responsive so that it could scale and look good at any size.
Once I was done with the containers and layout, I fleshed it out with some nice graphics that I found online (which were free to use). If you want to see the final result, you can check out the website here.
What did I learn in this course? How to build a complete site, with a header, footer, main content, sidebar, and contact page, from scratch using HTML and CSS. It was also interesting to see that I was still a little rusty in Photoshop, which I haven’t used in a while. I used to dabble in photo editing a lot back in the day (many years ago!).
I wrote about the completion of this course a while back.
If you haven’t read my blog post about it, click the link below:
JavaScript Fundamentals
My next course at WGU took me to the programming language of the web: JavaScript. The first project right out of the gate was to create a world map using Angular, a JS framework. There was so much to learn! At first, I’ll be honest, I was a bit overwhelmed. At the same time, though, it felt great to finally get into the nitty gritty of creating a web app. 😊
My Angular app had a pretty cool feature: it could be used with both mouse and touch inputs. When I had the mouse cursor over a country on the map, it would highlight and provide details like the country’s capital, among other things.
I was now officially learning the things that I knew would give me a solid foundation for a future web development career. I spent the next couple of weeks immersed in JS and learning the ins and outs of this amazing, but complicated language.
For those not aware, JS is the engine that makes websites run. It powers the interactivity that keeps us coming back to websites over and over.
The JS language has several parts. These include:
- JavaScript: The actual code that runs inside the browser
- The DOM: The Document Object Model which helps us manipulate web elements
- JSON: An open-source format for data interchange
- Node.js: A runtime environment that allows JS to run server-side code
JS is a big part of web development because it provides the interactive and animated elements of a web page. It’s a language that has come a long way over the years and can be used for anything. JavaScript runs in every web browser, out of the box. This is why it is the preferred programming language for anything web-related.
Nowadays, JS has evolved into something that developers can use for both frontend and backend applications. It can even be used for creating games!
I spent the rest of the year studying JS and diving into its various uses. The more I studied, the more excited I became about using it for my future web development projects. At this point in my journey, Python took a backseat and I wasn’t really using it much, if at all.
I’ve told myself that one day I’ll go back to Python and try to get more familiar with it, but right now my main focus is JS and learning as much about it as I can. Unlike HTML and CSS, JavaScript is a full-fledged programming language and it is going to take me years to fully master. I passed the course and I posted about it a while back. If you haven’t read it yet, click on the link below:
As an aside, angular is a discontinued framework since 2021, so I wouldn’t recommend using it in the future. Not really sure why it’s still being used for the JavaScript course at WGU, but hopefully they update their curriculum with a more up-to-date framework.
End of the Year Review
Looking back, I am satisfied with how much I’ve learned. I haven’t really created anything that I could show to a potential employer or put on a resume yet, but I am slowly getting to the point where I will be able to do that.
I am also really enjoying my time at WGU. So far, it has been a wonderful experience, and I have learned a lot. I’ve had a few people ask me about whether or not I think WGU is worth the money. In my opinion, yes. I think that the education you receive is definitely worth the price, and it’s a lot cheaper than what most universities charge.
I would definitely recommend this school to others, especially to those who have a busy schedule and cannot attend traditional classes.
The pace of the courses is really nice. Since there are no deadlines, you can work at your own pace, and you can even skip courses and go straight to the final project if you feel confident in your knowledge.
This year, I plan to master JS enough to code something into existence that can be tested by me and my friends. I’m thinking possibly a simple browser game. That’s my goal.
I am not sure if I’ll be able to pull it off, but I’m going to try my best.
Thank you for reading!
Last Updated on October 13, 2024
Leave a Reply