DEV Community: Brian G.

Mastering Git and GitHub: Best Practices for Branch Naming

Brian G. — Tue, 07 May 2024 13:26:28 +0000

While we’re learning how to use Git and GitHub, it’s pretty easy to use arbitrary names for branches, not to mention commit messages. Even seasoned developers do it, especially when in a hurry or working on something self-contained.

But as you transition to working as part of a professional development team, or contributing to an open source project, it’s crucial to understand how to name branches in a way that enhances project organization and communication among team members.

That’s what we’ll dig into in this post.

Why Branch Naming Matters

Git branching allows multiple developers to work on different features or fixes simultaneously without interfering with the main codebase.

Branch naming really boils down to communicating well with your team, and trying to make your work explain itself, as quickly as possible.

Clarity: Well-named branches give immediate insight into their purpose, making it easier for anyone in the team to understand the branch's focus.
Organization: Consistent naming helps in organizing and managing branches, especially in larger projects with many contributors.
Automation: Certain naming conventions can be leveraged by CI/CD pipelines and other automation tools to trigger specific workflows.

It's important to distinguish between temporary branches and permanent branches. Most of what we'll talk about in this post are temporary branches, the branches you'll use when writing a single fix, new feature, or chore. Temporary branches most often don't need to exist after the code is merged to the master or main branch, but it's still important and helpful to name them in a way that maximizes legibility and organization.

We'll also look at an example of permanent branch naming later in the post.

Best Practices for Naming Branches

Let's look at 7 widely accepted best practices for naming your Git branches.

1. Be Descriptive and Concise

Descriptive names convey the purpose of the branch clearly without needing to delve into its commit history. However, the name should also be concise enough not to become cumbersome to type or read.

Good Example: feature/user-authentication

Bad Example: new_magical_stuff

2. Use a Prefix to Categorize Branches

Prefixes like*feature, *fix, `chore*`, *release** describe the type of work and facilitate sorting and managing branches.

Common structures include:

- feat/<feature-name> or feature/<feature-name>
- fix/<issue> or hotfix/<issue>
- **chore/<chore-name>**
- release/<release-version>

3. Use Dashes to Separate Words

Use dashes rather than underscores or camelCase. Dashes are generally more accessible and readable, and work consistently across filesystems.

Example: feat/add-login-page

4. Avoid Special Characters

Stick to alphanumeric characters and hyphens. Avoid using spaces, underscores, or other special characters that might not be supported across all platforms.

5. Keep It Lowercase

Since Git is case-sensitive, sticking to lowercase avoids confusion and prevents issues that arise from case mismatches, especially when working across different operating systems.

Example: fix/fix-login-error instead of Fix/FixLoginError or Fix/Fix-Login-Error

6. Include Issue or Ticket Numbers

If your team uses a ticketing system, include the ticket number in the branch name. This creates an easy reference to detailed discussions about what the branch should accomplish.

Example: feat/123-update-user-profile

7. Consistency is Key

Whatever conventions your team chooses and uses, the most important thing is to be consistent. This makes it easier for all team members to understand and follow the branching strategy.

Learning From Examples

Let's look at these best practices in the wild.

Example: Cal.com

Cal.com, an open source meeting scheduling tool, mostly uses prefixes, including feat, fix, and refactor, while also utilizing descriptive names, hyphens, and underscores. While it’s not airtight consistency, it makes for readable branch names and quick filtering.

Example: Laravel

Looking at a mature code base like Laravel helps us see the difference between temporary branches and permanent branches.

Laravel’s permanent branches are primarily organized by major version numbers.

With temporary branches, the team will typically use prefixes to categorize work, along with dashes with descriptive names, always lowercase with purely alphanumerical characters.

Example: Shadcn-ui

For the UI component library Shadcn-ui, creator shadcn uses prefixes without using slashes to separate the prefixes. Again, consistency and readability are the most critical principle here.

You can see that some contributors to this project include a prefix with a slash while organizing their own work.

Practice Makes Perfect

A great way to get used to following these conventions is doing it on your personal projects.

At Curricular, we provide real-world practice projects to help developers like you master the foundational skills needed to do professional work. On our practice projects, we encourage users to follow best practices like this when committing features to GitHub.

Happy Coding!

When do you focus on making your code maintainable?

Brian G. — Fri, 15 Mar 2024 13:42:09 +0000

My team and I have been discussing an interesting question: when in your process do you focus on making code maintainable?

For context, this started with a discussion about how developers (particularly junior developers) can get better at writing maintainable code.

My company, Curricular, creates challenges for up-and-coming developers to practice their skills, including code reviews. We see lots of portfolio projects and capstone projects from bootcamps. Almost every project that we review has issues that impact maintainability, like vague variable/class/method names, or violations of principles like DRY or separation of concerns.

Obviously, when starting out, maintenance isn't as high a priority as just getting something to work, or meeting a deadline for school/bootcamp. But part of making the leap to professional developer is shipping code that you and/or others can work with in the future.

We've been dissecting our own processes to share when code starts to become more maintainable. For some, it's only through refactoring - at first it's really about getting things to work and then rewriting to optimize / subtract. For others, it starts when defining the problem - they're thinking about extensibility and future use cases right away.

My feeling is that a lot of this comes with practice. The more practice you get, and the more feedback you get from code reviews, the better your code becomes earlier in the process. But the same is true with refactoring - the more you do it, the better you get at it.

What techniques do you use to keep your code maintainable? And how much of your code's maintainability comes through refactoring vs. through your ingrained practices?

Code Review Best Practices for Junior Developers

Brian G. — Wed, 28 Feb 2024 13:33:12 +0000

Reviewing code is an essential skill for professional developers. If you're going to work in a team, you'll be expected to review other developers' code.

Most junior programmers I talk to find it daunting to start doing code reviews. Imposter syndrome starts to rear its head. After all, when you're a junior, how are you expected to provide great feedback to a more senior developer? How do you know you're looking for the right things?

Reviewing code is also an under-appreciated skill, and one that isn't usually taught. Regardless of whether you went through a bootcamp or CS program, or you're a self-taught developer, you typically learn code reviewing by doing it. And more often than not, you learn by having your code reviewed and then trying to emulate what you've seen others do.

This post aims to highlight key aspects to focus on during a code review and offering guidance on providing constructive feedback. This isn't the definitive resource - there's been a lot written about code reviews, including entire books.

Much of this post comes from Curricular's internal code review guidelines. At Curricular, we spend a great deal of our time reviewing projects, to help up-and-coming developers continue improving. To make our reviews as helpful as possible, and ensure our feedback is generally consistent across multiple reviewers, we've established internal code review guidelines and best practices. We've tailored those guidelines towards junior developers for this post.

Understanding Code Reviews

A code review is a phase in the development process where you, as a reviewer, check another developer's code to identify errors, ensure adherence to coding standards, and suggest improvements.

Typically, you’ll review a small change to the codebase, like a single issue.

The review is only partially about catching bugs; it's also an avenue for reinforcing best practices, ensuring consistency, and fostering a culture of collective ownership and continuous learning.

Most organizations and open source projects create their own standards and expectations around code reviews. Generally speaking, these standards are designed to aid collaboration and help teams move quickly. Code reviews are typically about improving the quality of code and fostering healthy discussions, without creating too many bottlenecks and slowing down development velocity.

How Doing Code Reviews Benefits Junior Developers

It’s one thing to receive feedback on code you’ve written. That’s for another post. Our focus here is on the benefits of reviewing other developers’ code.

As a junior, code reviews are a chance to sharpen your knowledge of a codebase, your communication skills, your understanding of best practices, and begin contributing to the team.

To do a great code review, you’ll typically need to spend some time learning about the surrounding codebase to understand how someone’s commit will interact with other components in a system (features, models, tests, etc.). This can, in turn, expose you to programming paradigms you may have only heard or read about, because as a junior, you probably haven’t worked on many distributed systems or microservices. Code reviews are therefore a great chance to learn up close.

Additionally, you can learn best practices. By observing how more experienced colleagues write and structure their code, you can learn effective coding practices firsthand. Development teams typically try to follow style guidelines, so code reviews are also a great orientation to how things are done within the specific context you’re working in. And whether you’re joining a new company or contributing to open source, you’ll be expected to conform to the established style guidelines, and to catch when someone else’s code doesn’t follow conventions.

Finally, performing code reviews helps to hone communication and critical thinking skills. At a certain point, technical skills will only get you so far in your career. To maximize your potential as a developer, you’ll need excellent soft skills as well. Code reviews require clear communication, attention to detail, and well-phrased questions and comments - essential skills for progressing to more senior levels.

What to Look for in a Code Review

Here are some of the key things to look for in a code review.

Correctness: Is the code doing what it's supposed to do? Verify logic, edge cases, and error handling to ensure the code meets its requirements. Also check to make sure there aren't any unintended side effects.
Readability: Assess the code for clarity and simplicity. Examine things like naming conventions, spacing, code structure, and check whether they follow best practices and the organization's style guidelines. When in doubt, ask for clarification, because chances are if you’re confused, someone else will be down the line.
Performance: Look for any potential bottlenecks or inefficiencies. Is there a way to simplify the code while still solving the problem?
Best Practices: Ensure the code follows industry and project-specific best practices. This includes design patterns, SOLID principles, DRY, and avoiding anti-patterns. Nothing scores you points with senior developers like catching and removing an anti-pattern.
Testing: Evaluate the coverage and quality of unit tests and integration tests, ensuring they are meaningful and robust. And ensure any impacted existing automated tests are also updated.
Security: Watch out for potential vulnerabilities, such as SQL injections, XSS, or data exposure. Depending on the seniority of the developer, it's probably rare to find something this glaring, but it's important to check.

Giving Great Feedback

Providing great feedback is an art. The best feedback focuses on the most important issues, fosters healthy conversations, and leaves both the code and the developer in a better place. Here are some things to focus on with your feedback:

Point Out the Good Parts, Too

If you catch someone doing something right, point it out. That will reinforce best practices, and also balance out the areas for improvement.

Be Specific and Constructive

Point out specific parts and suggest how they could be improved. Clarify which issues you feel strongly about and which you don’t.

Ask Questions

Instead of mandating changes ("you should" or "this needs"), ask questions that provoke thought, such as, "Could this loop be replaced with a map function for better readability?"

Provide Context

When suggesting changes, explain why. This helps the author learn and understand the reasoning behind your feedback, making it more valuable.

Focus on the Code, Not the Coder

Keep your language neutral and focused on the code. Use "we" instead of "you." And avoid humor and sarcasm. Bear in mind that tone is difficult to infer in online discussions. Unless it’s incredibly obvious, it’s better to keep it neutral.

Consider Sync Communication

If you notice recurring issues or have a more philosophical topic for feedback, consider a short video call to discuss in detail.

Don’t be a gatekeeper

Your job is to suggest changes; ultimately the owner of the PR will decide whether it gets approved.

Code Review Scenarios

Finally, it's important to consider the setting of a code review. Different contexts require difference approaches.

Code Reviews Within a Team

In team settings, the goal is to maintain a cohesive codebase and ensure all members are aligned with the project's coding standards and practices. Juniors should leverage these reviews to understand team-specific conventions and seek feedback on their contributions.

Tailoring your approach

Aim for constructive feedback, emphasizing how suggestions align with team practices. Don’t shy away from constructive feedback on more senior team members’ code - your contribution is important. But focus on asking questions for clarity until you get comfortable with the team’s norms.

Code Reviews on Open Source Projects

Reviewing code in open source projects can be a great way for juniors to get involved with new technologies and communities. Here, the emphasis might be more on adhering to the project's contribution guidelines and understanding the community's expectations.

Tailoring your approach

Be respectful of community norms and more conservative in suggesting changes, focusing on clear, documented issues or enhancements.

Code Reviews on Side Projects

When reviewing code for side projects, possibly with peers at a similar level, the purpose of the code review is probably more about mutual learning and checking for errors. This kind of code review can be more informal, offering a safe space for experimentation and discussion.

Tailoring your approach

There are probably fewer established guidelines within the codebase, so you might need to allow for more variance. Be sure to point out which issues are most significant to address. Ask lots of questions and explain context when suggesting changes. Consider leaning into more synchronous discussions to dive deeper into the strategies used and ways to improve.

Additional Resources

Code reviews are more art than science, and the only way to get truly great is with practice.

If you want to learn more, check out these other great resources on code reviews:

An oldie but goodie about how one developer approaches code reviews

Every organization treats code reviews slightly differently, so you'll want to adjust your style to fit the context where you're working. Here’s an example for how Palantir thinks about code reviews, which also contains tons of helpful links

Atlassian's guide to code reviews in agile development

What Kinds of Projects Belong in Your Developer Portfolio? 🚀

Brian G. — Fri, 09 Feb 2024 13:49:32 +0000

As a developer, your online presence speaks louder than your resume. Your portfolio is a calling card. It needs to make a great first impression, showcase what you can do, and inspire confidence in your potential.

Projects are the core of your portfolio. To stand out, you need well-crafted, intriguing, unique projects.

That's what this post is about - choosing great projects for your portfolio.

We're going to look at the three types of projects that you build throughout your learning journey. They serve a different purpose for building and showcasing skills.

But not all of them belong in your portfolio. So after digging into examples of each project type, we'll look at whether they're portfolio-worthy and why.

Quick note: these aren't specific project scenarios. I'm not going to tell you what to build. Instead, we'll look at the types of projects you should build, how they're different, and why it's important to build them at various points in your journey.

What Belongs in a Portfolio

Hiring managers and interview panelists don't spend more than a couple minutes looking at a portfolio. Two reasons: 1) They don't have much time to evaluate you or your projects, and 2) most portfolios look the same (short bio, a few stock photos, links to some clone sites).

So in most cases, the portfolio evaluation is about two things: "Does the portfolio exist?" and "Is there anything off in the design or content of this portfolio so I can disqualify the candidate?"

You've got a split second to grab their attention before they form an opinion about your skills, and if they're not hooked, potentially move on to the next candidate.

As a result, your portfolio should be simple and functional. Introduce yourself and your work. Include your contact information and your professional interests. Make the design crisp and with personality, but professional. And make sure it loads quickly and works across browsers.

And include the right kinds of projects.

The Three Projects Types

Projects for Practice
Projects for Evidence
Projects for Experience

1. Projects for Practice

Objective: Focus on reinforcing foundational concepts and exploring new technologies.

Benefits:

Solidifies core programming concepts.
Introduces a broad range of technologies and frameworks.
Provides a safe environment to make mistakes and learn from them.

You haven’t really learned a skill until you're able to apply it to solve an emerging problem. The way you get there is by practicing a specific skill or set of skills over a period of time in different contexts, with increasing complexity.

Intentionally practicing a specific set of skills deepens your understanding and writes knowledge to long term memory.

Practicing over time strengthens your ability to call up the skill when you need it. They say practice makes perfect - it’s because repetition helps you do things well and have more control over what you’re doing.

Obviously this isn't the most attractive type of project, so you may be tempted to skip smaller practice projects and move on to building something meatier. But if you skip practice, you risk not truly understanding the foundations, and how tools work under the hood. Without solid fundamentals and more situational experience, it's hard to know when to use the right tool for the job.

Include in Portfolio: No

Examples:

Practice Problems: Short, situational coding problems to help you sharpen your skills. This can be a single feature of a website (e.g. styling a form) or some sort of math or logic problem. Some courses include practice problems: Scrimba, Udacity, and Codecademy are the best at this. FreeCodeCamp is also pretty good, though their problems are fairly guessable. ChatGPT is also pretty good at coming up with practice problems. Give it a scenario like “an event planning website” and ask it for practice problems on whatever topic (e.g. styling a form, passing parameters between React components, control flow in Python)
Tutorial-based Projects: Follow along with detailed tutorials to build applications. This introduces you to new tools and libraries and helps you learn to apply these tools in new situations. But don’t code along, there’s a better way.
Algorithm Challenges: Take on coding challenges on platforms like LeetCode or HackerRank to sharpen your problem-solving skills.
Clone Projects: Rebuild existing applications or websites. This helps in understanding how certain functionalities are implemented. But don’t just clone any site - ask ChatGPT for ideas of applications you might build to practice certain skills, and then look for websites to clone.

2. Projects for Evidence

Objective: Create projects that test and demonstrate your development abilities.

Benefits:

Proves that you can work on real-world software.
Refines your skills set to solve real world problems.
Helps you spot additional areas to work on.
In some cases, exposes you to the dynamics of working within a team.

Evidence projects act as tangible proof of your skills and dedication. Employers aren’t going to take your word for it that you know how to build applications. You have to have something to show for it.

At the same time, evidence projects help you measure your skill level and uncover gaps.

The best way to see how your project stacks up? Get feedback from more experienced developers. Have them check your architecture, your systems design decisions, and your implementation.

Evidence projects are one of our main focus areas at Curricular; real-world projects that help developers see how their skills stack up.

Once you're confident and can crank out evidence projects, you're ready for professional development.

Include in Portfolio: Yes

Types of Projects:

Personal Website/Portfolio: Yes, your portfolio counts as evidence, particularly of your design / frontend development skills. At the end of this post, I have more tips for making a great portfolio website.
End-to-End Applications: Develop applications that show the full range of what you can do. These could be passion projects or apps you wish existed. The more real-world you can make these projects, the better. If you need ideas, again you can consult ChatGPT. Or you can browse some of the portfolio project prompts on Scrimba, Udacity, or Codecademy - you won't get the full requirements, but enough to see the domain and problem, and you can do some additional research to flesh out the requirements.
Hackathons and Coding Competitions: Participate in hackathons to experience the pressure of delivering a working prototype under time constraints. The bonus is you're typically provided a fairly detailed prompt, so you can focus on understanding the problem and devising a solution.
Automate Something Repetitive: I have a friend who just graduated from a bootcamp who was annoyed with having to write tons of cover letters, customizing them for each company. So she integrated with ChatGPT to input her resume and a few details about the company and voila, out came a well-written cover letter. She ended up sharing the app with several of her classmates as well, which transformed this into a “skills experience” project. Who do you think was hired first from her cohort?

Note: You might be tempted to think clone projects are evidence projects. But clone projects are practice, because you’re basically following a guide of what someone else created. They're like a better tutorial. Solving a problem that nobody has solved, or at least taking a new approach to solving a problem, is far superior to cloning someone else's solution, especially for a portfolio. We can debate this in the comments.

3. Projects for Experience

Objective: Use your skills to solve real world problems for real users.

Note: these project don’t mimic real world scenarios; these are actual production projects with users.

Benefits:

Add to the most important part of the resume: experience
Builds user focus - understanding client requirements and delivering accordingly, and iterating based on feedback and emerging needs.
Potential for income

Companies are significantly more likely to hire someone who has worked or is working professionally. That's why CS programs push internships - internships are actual professional experience.

If you want to stand out to employers, find ways to work professionally. Experience projects are far superior to evidence or practice projects.

This goes for your resume and your examples during the interview process. Every hiring manager I've spoken to has said the same thing: experience shipping production applications is essential.

Who were your users? What were their problems? How did you solve them? Those are the key questions you should be able to answer. And you should be ready for follow ups like what approaches you considered, why you chose particular tools to build your solution, what tradeoffs you had to make, and how you might improve it in the future.

Include in Portfolio: Yes

Types of Projects:

Freelance Projects: Take on freelance projects that match your skill level. This could range from developing websites for local businesses to joining a freelancing site like Upwork, or taking on a bounty on Repl.it.
Internships or Entry-level Projects: Work in a real development environment, even if the role is unpaid or at a super entry level. You might try to find a local business with a software-related problem to solve (nearly all local businesses have these problems; you may have to talk to several until you find one willing to accept a solution, and even then it will probably be complimentary).
Contribution to Open Source: Contribute to open-source projects. Your commits serve as a tangible contribution to real-world software. There are projects for nearly every language and framework, and often there will be issues logged “good first issue” - a great place to start.

How do you know you're ready for an experience project?

Complete a few evidence projects. If you can solve challenges in new situations, and feel confident you can explain why you made certain decisions, you should move on to experience projects.

If you're still not sure if you're ready, find a more experienced developer and ask them to review your code and give you feedback on ways to improve. Ask them to treat it like a professional code review and to beat up your code.

Again, this is how we treat code reviews for evidence projects at Curricular. The bar to become a professional developer is high. You've really got to know your stuff. Developers who pass our projects have cleared a significant hurdle. And they come out of the project experience with specific actionable takeaways for how they can improve.

Conclusion - Building an Outstanding Portfolio

Successfully launching a career in tech involves a blend of learning, demonstrating, and applying your skills.

By engaging in projects for skill development, creating evidence of your skills, and gaining real-world experience, you'll position yourself as a valuable asset in the tech industry.

In the end, what makes the perfect project portfolio?

Updated: include only your greatest projects. As you gain more experience, those projects should replace your evidence projects. Discuss what you're working on now.
Polished: Make sure all the links work. If your applications are hosted, they should still run. Use a design system, and try to make it look timeless.
Professional: Some personality is good, but don't overload it with details about your personal interests. Limit the number of hobby / niche projects, unless those hobby projects are dev tools.

If you found this helpful, check out more resources at curricular.dev. We're building a library of projects (practice projects and evidence projects) to help developers master any technical skill.

What kinds of projects belong in a developer portfolio? 🚀

Brian G. — Thu, 01 Feb 2024 15:22:00 +0000

Projects are the core of your portfolio. To stand out, you need well-crafted, intriguing, unique projects.

That's what this post is about - choosing great projects for your portfolio.

We're going to look at the three types of projects that you build throughout your learning journey. They serve a different purpose for building and showcasing skills.

But not all of them belong in your portfolio. So after digging into examples of each project type, we'll look at whether they're portfolio-worthy and why.

What Belongs in a Portfolio

So in most cases, the portfolio evaluation is about two things: "Does the portfolio exist?" and "Is there anything off in the design or content of this portfolio so I can disqualify the candidate?"

You've got a split second to grab their attention before they form an opinion about your skills, and if they're not hooked, potentially move on to the next candidate.

And include the right kinds of projects.

The Three Projects Types

Projects for Practice
Projects for Evidence
Projects for Experience

1. Projects for Practice

Objective: Focus on reinforcing foundational concepts and exploring new technologies.

Benefits:

Solidifies core programming concepts.
Introduces a broad range of technologies and frameworks.
Provides a safe environment to make mistakes and learn from them.

Intentionally practicing a specific set of skills deepens your understanding and writes knowledge to long term memory.

Include in Portfolio: No

Examples:

Practice Problems: Short, situational coding problems to help you sharpen your skills. This can be a single feature of a website (e.g. styling a form) or some sort of math or logic problem. Some courses include practice problems: Scrimba, Udacity, and Codecademy are the best at this. FreeCodeCamp is also pretty good, though their problems are fairly guessable. ChatGPT is also pretty good at coming up with practice problems. Give it a scenario like “an event planning website” and ask it for practice problems on whatever topic (e.g. styling a form, passing parameters between React components, control flow in Python)
Tutorial-based Projects: Follow along with detailed tutorials to build applications. This introduces you to new tools and libraries and helps you learn to apply these tools in new situations. But don’t code along, there’s a better way.
Algorithm Challenges: Take on coding challenges on platforms like LeetCode or HackerRank to sharpen your problem-solving skills.
Clone Projects: Rebuild existing applications or websites. This helps in understanding how certain functionalities are implemented. But don’t just clone any site - ask ChatGPT for ideas of applications you might build to practice certain skills, and then look for websites to clone.

2. Projects for Evidence

Objective: Create projects that test and demonstrate your development abilities.

Benefits:

Proves that you can work on real-world software.
Refines your skills set to solve real world problems.
Helps you spot additional areas to work on.
In some cases, exposes you to the dynamics of working within a team.

At the same time, evidence projects help you measure your skill level and uncover gaps.

The best way to see how your project stacks up? Get feedback from more experienced developers. Have them check your architecture, your systems design decisions, and your implementation.

Evidence projects are one of our main focus areas at Curricular; real-world projects that help developers see how their skills stack up.

Once you're confident and can crank out evidence projects, you're ready for professional development.

Include in Portfolio: Yes

Types of Projects:

Personal Website/Portfolio: Yes, your portfolio counts as evidence, particularly of your design / frontend development skills. At the end of this post, I have more tips for making a great portfolio website.
End-to-End Applications: Develop applications that show the full range of what you can do. These could be passion projects or apps you wish existed. The more real-world you can make these projects, the better. If you need ideas, again you can consult ChatGPT. Or you can browse some of the portfolio project prompts on Scrimba, Udacity, or Codecademy - you won't get the full requirements, but enough to see the domain and problem, and you can do some additional research to flesh out the requirements.
Hackathons and Coding Competitions: Participate in hackathons to experience the pressure of delivering a working prototype under time constraints. The bonus is you're typically provided a fairly detailed prompt, so you can focus on understanding the problem and devising a solution.
Automate Something Repetitive: I have a friend who just graduated from a bootcamp who was annoyed with having to write tons of cover letters, customizing them for each company. So she integrated with ChatGPT to input her resume and a few details about the company and voila, out came a well-written cover letter. She ended up sharing the app with several of her classmates as well, which transformed this into a “skills experience” project. Who do you think was hired first from her cohort?

3. Projects for Experience

Objective: Use your skills to solve real world problems for real users.

Note: these project don’t mimic real world scenarios; these are actual production projects with users.

Benefits:

Add to the most important part of the resume: experience
Builds user focus - understanding client requirements and delivering accordingly, and iterating based on feedback and emerging needs.
Potential for income

Companies are significantly more likely to hire someone who has worked or is working professionally. That's why CS programs push internships - internships are actual professional experience.

If you want to stand out to employers, find ways to work professionally. Experience projects are far superior to evidence or practice projects.

This goes for your resume and your examples during the interview process. Every hiring manager I've spoken to has said the same thing: experience shipping production applications is essential.

Include in Portfolio: Yes

Types of Projects:

Freelance Projects: Take on freelance projects that match your skill level. This could range from developing websites for local businesses to joining a freelancing site like Upwork, or taking on a bounty on Repl.it.
Internships or Entry-level Projects: Work in a real development environment, even if the role is unpaid or at a super entry level. You might try to find a local business with a software-related problem to solve (nearly all local businesses have these problems; you may have to talk to several until you find one willing to accept a solution, and even then it will probably be complimentary).
Contribution to Open Source: Contribute to open-source projects. Your commits serve as a tangible contribution to real-world software. There are projects for nearly every language and framework, and often there will be issues logged “good first issue” - a great place to start.

How do you know you're ready for an experience project?

Complete a few evidence projects. If you can solve challenges in new situations, and feel confident you can explain why you made certain decisions, you should move on to experience projects.

Conclusion - Building an Outstanding Portfolio

Successfully launching a career in tech involves a blend of learning, demonstrating, and applying your skills.

By engaging in projects for skill development, creating evidence of your skills, and gaining real-world experience, you'll position yourself as a valuable asset in the tech industry.

In the end, what makes the perfect project portfolio?

Updated: include only your greatest projects. As you gain more experience, those projects should replace your evidence projects. Discuss what you're working on now.
Polished: Make sure all the links work. If your applications are hosted, they should still run. Use a design system, and try to make it look timeless.
Professional: Some personality is good, but don't overload it with details about your personal interests. Limit the number of hobby / niche projects, unless those hobby projects are dev tools.

If you found this helpful, check out more resources at curricular.dev. We're building a library of projects (practice projects and evidence projects) to help developers master any technical skill.

How to Fit Learning into a Busy Schedule 🚌👩‍💻🎪

Brian G. — Wed, 24 Jan 2024 13:16:00 +0000

At Curricular, we spend a great deal of our time learning, since we review and test dozens of courses every month.

But we also spend time learning new skills.

Currently, I'm trying to learn more about using AI for life and business - training and optimizing models, automating pipelines, and more.

How's it going? I've learned a lot, but I've been swamped with other stuff, so I'm a bit behind where I wanted to be.

So this post is for me as well as for you - I need to take my own advice. Hopefully this post helps us all make significant progress towards our goals.

While no single bit of advice can help everyone in every situation, here are a few strategies for fitting learning into a busy schedule.

Prerequisite: Know Your Priorities

In 15 years in the developer education industry, I've seen one thing consistently separate learners who stay on track and those who don't.

Priority.

If you don't prioritize learning, it doesn't happen. It's the same for people trying to break into the industry as for professional devs adding more skills to get promoted.

So before trying to fit learning into your schedule, it's best to check in on your priorities. Where does learning stack up against everything else going on in your life? And I mean everything, from work to family obligations to exercise to sleeping to Netflix.

I'm not suggesting learning should come before things like sleep, family, and work. But you should at least take inventory of all the things competing for your time, attention, and energy. And assess how important those things are for you in your life.

If your learning goal is making a career transition, you might find you need to make some pretty significant sacrifices. When I was with the coding bootcamp App Academy, I met hundreds of students who were basically putting their life on hold to learn software development, and making agreements with the people in their lives to make space for the intensive program. But with life-changing results on the line, it's an investment they and their families and friends were willing to make.

Again, that's not for everyone. But the prioritization exercise is probably the biggest step you can take to find time for learning.

Audit Your Schedule

Now that you've done one exercise identifying everything competing for your time, and the priority of those things, it's time to look at how much time everything takes.

The goal here is to surface how much time you have for learning, and cutting a few lower-priority things in order to make space for learning.

Overall, a time audit will give you a good idea for exactly how much time you can realistically budget for learning.

If you want to be hardcore, you could do an in-depth calendar study, where you chart how you spend time for a few weeks. That's everything from sleep to work to commuting to meals to Netflix. All of it goes on the calendar.

There are apps that can help you do this automagically. I've typically used a simple method: setting an alarm for every hour during the day, and when the alarm goes off, I spend 1-2 minutes to log how I just spent the previous hour (during the evening, I logged my time once or twice).

Visualizing where your time actually goes can be eye-opening. You'll probably notice you spend a lot of time on unplanned stuff. But you'll also probably find several blocks in your schedule that could be repurposed into learning time in future weeks.

Depending on your life situation and your learning goals, you might find that you need to re-prioritize some things to make space for learning. What you're really hoping to find are those things that are low priority but that you spend lots of time on. Replace as many of those with learning as you can.

You might also find that there's not currently any space for learning in your schedule; that you can't cut anything you're spending time on. If that's the case, it's ok. This might not be a season where you can invest in learning, or at least for a significant amount of time.

Again, when looking for things to cut, be sure to leave time for wellness. Exercise, cooking, leisure, and sleep are all important parts of wellbeing. Don't sacrifice the essentials for the sake of learning - otherwise you'll burn out, and the results will be worse than not spending the time learning.

Microlearning and Time Heisting

Long focused learning blocks on your computer are a must, especially for practicing programming and synthesizing multiple concepts.

But microlearning (and learning on the go) can be a great for making some incremental progress on individual concepts.

We're living in a golden age of flexible learning, with podcasts, books (physical and digital), blogs, tutorials, livestreams, as well as courses.

A 10-15 minute blog post or YouTube tutorial can help you grasp the basics of concepts. And often it's easier to find 15 minutes than to find an hour. Most of these formats can be consumed on your phone, while you're commuting or on lunch break.

And if you're able to convert the time commuting, at lunch, or waiting for your coffee order into progress towards your learning goals, you can consider it a time heist - time you had to spend waiting for something anyway.

Appointment Learning

If you're like me, prioritizing learning means getting it on my calendar, as an appointment. The time is marked busy and I can't schedule over it.

If I don't treat learning that seriously, I'll find some other way to spend the time (let's face it, probably on social media or Netflix).

The goals here are 1) to make sure I take the time to learn and 2) to make learning a consistent habit. Skills are like muscles - if you don't use them consistently, you have a harder time building them up and maintaining them.

For best results, try to schedule your learning for when you’re at your best. Are you a morning person or night owl? That's your best time to learn.

When scheduling your learning, don’t overdo it. Start out with something that's easy to accomplish and can help you build momentum.

If you’re planning to learn full time or for large chunks, spend some building up to that schedule. Try learning for a little bit every day, like 1-2 hours in the afternoon. Then build up to longer stretches a few times per week.

Check in and Iterate

Plan to iterate on your learning schedule. Life happens, so keeping the same schedule isn't realistic.

When starting out with a learning plan, give yourself a week or two with and then do a quick check-in. Ask yourself is this sustainable or do I need to adjust right away? And then check-in every few weeks after that.

Block Out Distractions to Maximize Learning

Sometimes the best way to optimize your schedule for learning is to optimize your learning blocks.

Consider learning in the same location or space. For me, going to a specific place for studying gives me a kind of muscle memory - when I'm in this place, this is what I do. A short commute helps as well. I like to walk to a nearby cafe, which helps me clear out all the noise from work so I can focus on learning.

If my library was closer, I'd probably walk there.

During my learning time, I have my phone face down and on silent. I close whatever browser windows I'm not using for learning. I hit Focus mode on iOS, usually for 1 hour. There are apps that can help with this; for me, the act of deliberately closing everything out helps me focus on learning.

Destination Learning

Now I'm going to contradict myself a bit here.

Earlier I mentioned it's good to build up to long blocks of learning. While that's true, it can also be good to schedule an extended block of learning and just go for it. You're not likely to burn out from a short sprint.

So this technique is to book a learning vacation: a dedicated weekend or week to take a break from everything else and just focus on learning.

Just be aware that if you do plan a getaway, you might find yourself with a new set of distractions. So don't choose somewhere too awesome, with lots of activities you want to do.

Obviously this technique is geared more towards taking a small but significant step forward in your skills. If you're in the midst of a longer learning journey, this can be helpful for focused practice time, like working on a portfolio project.

What Do You Think?

Have you tried any of these techniques or other things to make progress on your learning goals? Let me know in the comments.

The Right Way to Use Tutorials

Brian G. — Wed, 17 Jan 2024 15:30:00 +0000

This post is primarily aimed at developers early in their coding journey, in particular self-learners trying to break into the industry.

This is advice I wish I had when I was starting out.

There's a right way to use coding tutorials and a wrong way to use coding tutorials.

In this post, I'll explain what this means.

The Wrong Way to Use Tutorials

The wrong way? Coding along with a tutorial, copying what the teacher is doing.

I'm guilty of this. I've done it countless times. And in a pinch, I still do it, just to solve a problem and get something out the door.

Why is this wrong? When you code along with a demo, you're not learning how to code. You're learning stenography.

If you get into this habit, you'll probably struggle to build something on your own. And that's how you end up in tutorial hell - dependent on tutorials but unable to use what you're learning.

I'm not saying avoid tutorials. Tutorials are actually great. I mean, think about it: you can find a tutorial to learn just about anything coding-related, many of them for free. That's a good thing.

But the trouble is, tutorials are just a resource. They're incomplete on their own.

In school, you have homework and tests. While annoying, they're actually designed to check for knowledge, deepen memory encoding and recall, and translate knowledge into skills.

That's why we fall into the trap of coding along. Without an assignment, we try to skip to translating seeing into doing.

And don't get me started on copy-pasting the code from a tutorial without even reading/watching it. Let's just all agree that we've done it in the past, we might occasionally do that in the future, and give ourselves a pass.

A better way to watch tutorials: Consume, Summarize, Practice

1. Consume

Watch/read straight through the tutorial, taking notes. I recommend taking written notes rather than typing. Some studies have suggested that taking written notes helps with long term recall, because the physical act of writing forces you to slow down and actively engage with the material.

While taking notes, try to avoid writing down every single step. Generally speaking, with programming you're not trying to learn a precise step-by-step process, but rather techniques and strategies for solving problems, and how these techniques work.

You should also pause/rewatch if something is confusing. Unlike a live lecture, recorded media puts you in control of the experience; use these controls to your advantage.

2. Summarize

Next, write a short summary description of the tutorial.

This process checks to make sure you understood the tutorial at a high level and remember the essentials.

Feel free to reference your notes at this stage. This isn't a test, this is translating what you've watched into your own thoughts.

2b. Check Your Summary

After completing your summary, watch/read through the tutorial again to grade your summary and fill in any missing gaps.

At this point, you should have a detailed description / step-by-step guide in your own words, which you can use for future reference. Congratulations, you're no longer dependent on the tutorial.

3. Practice

Next up, you're going to practice your newly-learned skills by creating an assignment for yourself.

Write down the basic requirements of the assignment. List all the things the program in the tutorial actually does. You're trying to make a list of acceptance criteria for your assignment - what does your program need to do to replicate its functionality?

Next, complete your assignment. You should be re-creating the program from the tutorial from scratch.

During your practice, avoid looking at your notes unless you're completely stuck. Instead look at the program specs from your assignment and try to figure out the best solution.

The goal is the output / solution, so don't worry about getting each step right.

Bonus Practice

If you really want to go to the next level, create a second assignment where you change up some of the requirements.

Because applying what you know in a new situation is the best way to sharpen your skills.

Conclusion

Do you use a similar system for learning? Do you take written notes or type them out? I want to hear from you what's worked.

And if you found this helpful, head over to curricular.dev, check out our developer learning guides where we recommend the top courses to learn in-demand topics, and sign up for our mailing list. Also, if you're on Twitter/X, let's connect.

Stay tuned for more in this series, the Developer's Learning Toolkit.

Happy Coding!

Which Skills Are Essential for Junior Full Stack Developers? ✅ 👩‍💻

Brian G. — Tue, 09 Jan 2024 14:32:00 +0000

At Curricular, my team and I spend hours researching, reviewing, and recommending the best ways to learn development skills. You can check out our learning guides at curricular.dev

As part of our research, we decided to compile a list of the skill areas that are needed to work professionally as a Fullstack Developer, mostly independent of frameworks or tooling. This is the sequel to our previous post about the skills Frontend Developers need.

And now I'd like your feedback.

About the List of Essential Skills for Junior Fullstack Developers

My team interviewed a bunch of senior developers, sifted through a lot of the readily-available online advice, and debated with one another to produce this list.

Our goal is to help aspiring fullstack developers understand which technical skills are most important to prioritize, in order to excel as a Fullstack Developer and meet or exceed your teammates' expectations.

Of course, learning never stops, and some skills are important to acquire as you gain experience as a junior developer. So we've separated skills into a Foundational List and a Growth List with new and Junior Fullstack developers in mind.

The items in the Growth list are things that a Junior developer would not be expected to handle alone, right out of school, on a team.

Within each, the knowledge areas have been categorized into domains: UI Design & Interactivity, Frontend Servers, State Management, HTTP Request / Response, API Development, and Databases. These are somewhat loose domains meant to help you consider skills based on their main purpose.

Often the skills cross into multiple areas, so don't take this as a strict classification; placing a skill in one domain versus another doesn't mean that it precludes the others.

Of course, these are technical skills. There are additional nontechnical skills you'll need in order to excel, like teamwork, creativity, problem solving, pair programming, and estimation. Those are also left off at this point.

I'm excited to hear your feedback!

Foundational Skills

User Interface Design & Interactivity

HTML

Syntax
Elements
Attributes
Document Structure
Properties
Events

CSS

IDs and Classes
Dynamic Layouts and Responsive Design
- Flexbox
- Grid
- Variables
- Media queries
Frameworks - advantages, tradeoffs, and basic usage
- Tailwind
- Bootstrap

JavaScript

DOM Lifecycle
Browser event loop
Event listeners
Callbacks
DOM Manipulation
Async/Await
Promises
A JavaScript framework or library
- React
- Angular
- Vue

Frontend Servers

Static Site
Server-side Rendering

Version Control

Git and GitHub basics (clone, fork, branch, merge, pull request, conflict resolution)
Writing good commit messages
Protecting sensitive information

State Management

Global State

Frameworks and Patterns (e.g. Redux)

Local State

Prop Drilling

HTTP Request / Response

Protocols
TCP/IP & IP Addressing
Route
Headers
Payload
Status Codes

API Development

Backend Programming

Fundamentals of a backend language and framework
- JavaScript with Node & Express
- Python with Django or Flask
- Ruby with Rails

API Servers

Ports

Database Interfaces

ORMs
ODMs

Routing

REST
SOAP
GraphQL

Databases

Database Schemas and Models

Relational
- Tables
- Joins
Non-relational
- Documents
- References

Data Manipulation

Reading
Writing

Queries and Mutations

SQL basics
NoSQL basics

Database Management Fundamentals

Reliability
Efficiency

Additional Topics

Project Organization

Dependency Management
Source code kept separate from compiled code
All tests contained in their own folder

Web architecture

MVC
Microservices

Website hosting, delivery, and deployment

Cloud Computing Essentials
Cloud Platform Essentials (AWS, Azure)
Containerization (Docker)
Continuous Delivery and Continuous Integration

Software quality

Writing clean code
Testing and Test-driven development
Debugging strategies

Growth Skills

Generally, in most contexts, juniors will start working on support and some small contained features, with an increase in complexity as they acclimate and gain experience.

Some skills juniors will want to add in order to continue progressing include:

TypeScript
Accessibility
Security
Authentication and Authorization
Messaging / Message Bus
Caching
Enterprise Languages and Frameworks
- Java with Spring and Spring Boot
- C# with .NET / ASP.NET

What Do You Think?

Have we missed anything critical that you'd expect from a junior fullstack developer? Are there any skills on this list that you're surprised about? Or confused about? Let me know in the comments.

And if you're an aspiring full stack developer interested in learning these skills, check out our guide to the best fullstack programs and learning resources.

We Tested 40 Python Courses. Here Are the Best. 👨‍💻🚀

Brian G. — Fri, 05 Jan 2024 19:45:00 +0000

At Curricular, my team and I spend hundreds of hours every month reviewing courses and programs from around the web to recommend the very best. Our goal is to help developers cut through the marketing hype, make quick and confident buying decisions, and get the most from their time and money.

You can check out all our learning guides at curricular.dev.

We spent several hundred hours meticulously testing and reviewing several dozen Python courses from various vendors around the web. Here are the absolute best online Python courses available right now.

We independently test and review every course that we recommend. If you purchase a course we recommend, we may earn a commission. Our team includes developers and learning experts who have worked at most of the major learning platforms, but we don't have active employment relationships with any.

Our Top Pick

Udacity's Full Stack Developer Nanodegree

$249 per month | 4 months at 10-15 hours per week

The best self-paced Python course money can buy. It's expensive, but well worth the cost for the quality of instruction and the quality of feedback on your work. The emphasis on practice exercises and real-world hands-on projects are standout features.

Why It's Great

Emphasis on Hands-on Learning
Frequent Practice
Graded Portfolio Projects
Earning an Industry-Recognized Credential

Read Our Full Review at curricular.dev

Runner Up

edX's CS50 Web Development with Python and JavaScript

$199 for certificate (free to audit) | 30-40 hours

The gold standard for online courses provides the best way for programmers to learn basic Python and how to build web apps with Django and PostgreSQL.

Why It's Great

Aimed at Novice Programmers
Combines Lectures & Homework Challenges
Polished Course Materials
Certificate Available

Read Our Full Review at curricular.dev

Another Great Option

App Academy Open's Python, Flask, and SQLAlchemy

Free | 40 hours

Solid free option for learning professional-grade Python web development.

Why It's Great

Aimed at Novice Programmers
Learning Without Videos
Frequent Practice Throughout

Read Our Full Review at curricular.dev

Another Great Option

Codecademy's Build Python Web Apps with Flask Skill Path

$29.99 per month | 10 weeks at 10 hours per week

A solid option for learning to build web applications with Python and Flask, with engaging hands-on practice and a few challenging projects.

Why It's Great

Emphasis on Hands-on learning
Getting Started Quickly (No Config Required)
Includes Practice Projects

Read Our Full Review at curricular.dev

Another Great Option

Educative's Become a Flask Developer

$25 per month | 18 hours

Great option if you want to learn without videos, and curate your own Python and Flask learning path from a disparate set of materials.

Why It's Great

Gets You Up to Speed Quickly
Solid Resource for Ongoing Reference
Emphasis on Learning by Doing

Read Our Full Review at curricular.dev

Another Great Option

FreeCodeCamp's Scientific Computing with Python Certification

Free | 30 hours

This leaning path combines Dr. Chuck's excellent "Python for Everybody" course with autograded coding problems.

Why It's Great

Beginner-friendly
Expert-led Learning
Frequent Practice Throughout the Course

Read Our Full Review at curricular.dev

I hope you found this list helpful. If you did, check out our learning guides at curricular.dev and sign up to get them via email.

Avoid Tutorial Hell: Choosing Great Learning Resources 🧠

Brian G. — Sat, 30 Dec 2023 16:22:00 +0000

After setting learning goals (see my previous post), you're ready to fire up YouTube and start learning, right?

Not so fast! ⚠️

There are many excellent free or inexpensive learning resources out there. But frankly, there's also a lot of garbage out there.

It's easy to get stuck in tutorial hell - the endless cycle of watching tutorials without being able to actually do anything with the knowledge. It's critical to do some research and find the right courses, books, or tutorials.

And yet, while the internet is full of recommendations and reviews, I've found you also have to be careful taking someone's advice. Most reviews are way too short ("good course, five stars") and lack helpful context. Most of the time, you don't know someone's learning goals, prior knowledge, or how they supplemented their learning.

That's why I created Curricular, to help developers find great courses, with trustworthy recommendations backed by in-depth research and testing.

Our goal is to help 1 million developers level up their career.

At Curricular, we curate lists of the best courses to learn any technical skill. Our recommendations come from hours of research and in-depth testing, and we write detailed reports about our methodology and findings.

We also provide free personalized learning recommendations (seriously - ask us anything, we're glad to help).

Choosing a Great Course

Here are some lessons from our course evaluation framework to help you choose a great course.

A great course is one that's built intentionally using the right teaching methods / learning styles for the material, is taught at the target student's level, and delivers its stated objectives.

When choosing a course, you should look for the following:

was the course created for someone with my learning goals and current level of knowledge?
does the course list tangible learning outcomes?
does the course seem to promise too much? (e.g. "everything you'll need to become a professional developer!" -- avoid at all costs)
does the course offer hands-on practice opportunities - either in-browser coding or solo practice projects?

Where possible, you also want to evaluate the instructor. First, you want to make sure they know what they're talking about. Are they qualified to teach the material? You want to see that their explanations are clear, and that in demonstrations, they show you how things work, rather than just tell you how they work. Look for samples you can preview, and reviews that talk specifically about their expertise.

Don't Ignore the Prerequisites

Before starting a course or tutorial, make sure you’re ready. Check the prerequisites and evaluate your skill level.

If you don't have the right prerequisite knowledge, you might struggle to learn the topic.

For example: lots of people want to learn React. It's still one of the hottest libraries. But if you're not solid with JavaScript foundations, you're going to have a hard time learning React, since so much of React is writing plain old JavaScript.

This might be tough to hear. We all have limited time to learn. And how do you know when you know enough to move to the next concept?

I'm not saying you have to feel solid with every prerequisite that you find. If that were the case, we'd never get anywhere.

But at the very least, be aware of a course's prerequisites and be honest with yourself about your comfort level with the concepts. If you're feeling fuzzy about too many of the prerequisites, you may need a bit more practice before getting started.

Mix and Match and Supplement with Solo Practice

Very few courses offer literally everything you'll need to master a topic - that is, to get to professional proficiency with a language or framework.

That's why most of our recommendations at Curricular are learning paths rather than single courses.

You should plan to take several courses (or books) to learn a topic.

And you should also plan to supplement with a practice project to solidify your knowledge. What I mean by this is take on a project without guidance; build something yourself using the technologies you've learned. Practicing with a solo project will test your skills and show you where you need to keep studying.

And try to get feedback on your projects from a more experienced developer. They'll help you spot areas for improvement and where you've missed best practices.

Unfortunately, very few courses and platforms offer grading or feedback on projects, with Scrimba and Udacity being the main exceptions.

More Tips to Level Up Your Learning

Be sure to follow the rest of our series - The Developer's Learning Toolkit - for more tips on how to get the most from your learning.

Crafting Better Learning Goals
Avoid Tutorial Hell: Choosing Great Learning Resources (THIS POST)
How to Fit Learning into a Busy Schedule
Celebrate Your Learning Progress (and Your Bugs)
Learn, Build, Teach: Taking Your Learning to the Next Level
Should You Really Learn in Public?
Regaining Momentum After a Learning Break

-Happy Learning and Coding!

Crafting Better Learning Goals 🎯 👩‍💻

Brian G. — Sat, 30 Dec 2023 10:23:00 +0000

If you don't define where you're going, how are you going to get there?

Many junior or aspiring devs I talk to only have a loosely defined goal for why they're learning something. While the high level goal might be in place (e.g. "getting a full time job"), the motivation to learn a specific topic (DS&A) tends to be driven by anxiety, imposter syndrome, or even a known skills gap.

Sometimes we hear people talking about a hot language or framework and think “I gotta learn that” and we jump right into tutorials.

Taking the time to write down your goals will help you choose the right learning resources, the right level of intensity for your training, and will help you stay on course once you begin.

A few questions to consider:

How does learning this skill fit into your broader career goals?
What do you hope to be able to do with the skill(s)? Here you want to visualize success, and list as many things as possible. For example, if you're learning DS&A, are you hoping to be able to solve any LeetCode challenge? Interview with more confidence? Write more efficient programs?
At what level do these skills need to be (conversational, junior practitioner, professional, senior)?

Answering these questions will help you choose tutorials and courses more effectively, and to measure your progress against your learning.

Define SWBATs

If you really want to level-up your learning, take this exercise a step further and pair your high level objectives with some tangible, action-oriented target outcomes.

One tool that great teachers use when writing learning objectives is creating SWBATs. This acronym means “students will be able to” and it’s the prefix of a short sentence describing a student's capabilities after taking a course (or reading a book or article).

Some of my SWBATs for this article include:

Students will be able to articulate high level learning goals tied to their near-term career objectives.
Students will be able to write well-formed SWBATs for their personal learning plan

It's ok if you're not 100% sure of everything - after all, you're not expert in the topic area. But this exercise will encourage you to do some preliminary research about the topic to understand what people are doing with it in the real world.

As you're crafting this list, consider tapping into the wisdom of the crowd. Ask a developer community for advice and ideas for how to measure your proficiency in the skill.

And you can always add to your list of SWBATs as you know more. That's one of the paradoxes of learning: the more you learn, the more aware you become of other topics you need to learn.

One added bonus to completing this step: you're creating a way to assess your skills. If you're able to do everything listed in your SWBATs, you're probably ready to move on.

More Tips to Level Up Your Learning

Be sure to follow the rest of our series - The Developer's Learning Toolkit - for more tips on how to get the most from your learning.

Crafting Better Learning Goals (THIS POST)
Avoid Tutorial Hell: Choosing Great Learning Resources
How to Fit Learning into a Busy Schedule
Celebrate Your Learning Progress (and Your Bugs)
Learn, Build, Teach: Taking Your Learning to the Next Level
Should You Really Learn in Public?
Regaining Momentum After a Learning Break

-Happy Learning & Coding!

7 Courses To Help You Master CSS in 2024 🏅🚀

Brian G. — Wed, 20 Dec 2023 19:12:00 +0000

Learning CSS Foundations
Learning Intermediate CSS
Learning Advanced CSS

You can check out all our learning guides at curricular.dev.

Whether you're just starting out with CSS, looking to solidify your foundations, or leveling up as a professional front end developer, these are the best self-paced CSS courses and programs for every budget (even free) and learning style.

Learning CSS Foundations

Scrimba's Learn HTML and CSS and Learn Responsive Design - Our Top Pick to Learn CSS Foundations

$39 per month | 25-30 hours to complete

These are two of the most impressive beginner-friendly HTML and CSS courses available. Well made, effective, engaging, and a lot of fun.

Why It's Great

Beginner-friendly
Aimed at aspiring professionals
Emphasis on learning by doing
Option to start with a free course

Scrimba's approach involves learning the concepts by building functional websites. Each tutorial builds one upon another, and applies increasingly advanced concepts as you progress.

The Learn HTML and CSS course curriculum is available for free, while the Learn Responsive Design course requires subscription. A Pro subscription also gets you a completion certificate, full access to the community, and peer code reviews on your projects.

Get these courses at scrimba.com/allcourses

Frontend Masters' CSS Path - Runner Up For Learning CSS Foundations

$39 per month | 20-25 hours to complete

Solid on-ramp to CSS, going from the basics to professional-level CSS, with a particularly strong emphasis on real-world frontend development.

Why It's Great

Expert teachers
Real world insights
Workshop format makes you feel like you're there

Frontend Masters has some incredible instructors in their CSS path, coming from the front lines of some of the world’s top startups and tech giants.

The courses are broken up into focused deep dives on particular topics, so you'll get a thorough understanding of techniques like animations, variables, responsive design, and more.

We really liked that each of the courses is chock-full of practical application and real-world scenarios. You'll learn incredibly valuable real-world CSS tips and avoid rookie mistakes.

And the recent addition of the CSS Projects course has brought some much-needed hands-on practice to the platform. The workshop gives you project prompts and then walks through the instructor's solution.

Get this learning path at frontendmasters.com

Codecademy's Build a Website with HTML, CSS, and GitHub Pages - Another Great Option for Learning CSS Foundations

$25 per month | 25-30 hours to complete

Solid hands-on option for learning how to design, build, and deploy simple websites.

Why It's Great

Beginner-friendly
In-browser Coding Exercises
Hands-on Learning
Frequent Practice

The course material is almost entirely comprised of short readings and coding exercises to teach you each concept. This keeps your hands on the keyboard from the first lesson.

Each section of the course includes a hands-on project, most of which include detailed step by step instructions. The scenarios for these projects aren't always the most relevant to professional web development, but are typically engaging and illustrate the core concepts well.

The path wraps up with a capstone project where you have to apply all the skills you've learned to design and build a landing page for a school, given a set of wireframes. This fairly meaty project will definitely put your skills to the test.

Before You Buy

This path combines the Learn CSS course and Intermediate CSS courses, which are available for free. But if you subscribe and take this path, you also get access to some guided projects, practices, and the capstone project.

Most of the hands-on projects are guided, with step by step instructions. This means they're not terribly challenging, so you may reach the capstone project and find it takes a while to adjust to writing CSS without guidance.

Get this course at codecademy.com

FreeCodeCamp's Responsive Web Design Path - A Great Free Option to Learn CSS Foundations

Free | 25-30 hours to complete

If you’re brand new to programming, this is a great starting point for learning the basics, especially since it's free. After getting up to speed with the basics, you should consider moving to another more robust solution grounded in real world application.

Why It's Great

Hands-on learning
Beginners
Getting started quickly

This learning path starts with the basics and covers the essentials of designing and coding websites through a series of guided projects. After completing this path, you’ll understand various aspects of web page styling, including modern techniques like variables and pseudo-classes. You'll get lots of practice making web designs responsive and accessible.

Before You Buy

Many of the challenges are actually quite simple to game or guess at, because the reading gives away too many clues. We would prefer to see more difficult challenges built into the curriculum in order to help students build skills along the way. You may want to take on some additional challenges at Frontend Mentor, CodePen, or 100 Days of CSS to practice the concepts as you’re learning them.

Some of the projects aren't quite real world. So if you're looking to launch a career as a frontend web developer, make sure you continue with some independent projects that follow a real-world scenario.

Find this learning path at freecodecamp.org

Learning Intermediate CSS

Frontend Masters' CSS Path Electives - Top Pick for Learning Intermediate CSS

$39 per month | 25-30 hours to complete

A solid series of expert-led workshops that take you from the foundations of professional-level CSS to equip you will the skills to become a frontend leader.

Why It's Great

Code-along workshops
Expert teachers
Real world insights

With this path, you'll dig into more advanced topics in CSS, like creating SVGs and building design systems.

Get this learning path at frontendmasters.com

Scrimba's Learn UI Design - Runner Up to Learn Intermediate CSS

$39 per month | 10-15 hours to complete

Excellent deep dive into professional-level CSS topics. Solid combination of topic coverage, learning experience, instructor quality, and delivery of learning outcomes for aspiring frontend developers.

Why It's Great

Expert instructor
Emphasis on learning by doing
Projects with peer code reviews
Learn both techniques and design best practices

If you like learning by building projects and want lots of hands-on practice, you’ll love this course. Scrimba’s methodical approach to teaching concepts means you’re practicing something hands-on right after learning it, and then putting everything together into a project.

In this course, you'll build three real-world projects, including

Get this course at scrimba.com

Learning Advanced CSS

Josh Comeau's CSS for JS Developers - Top Pick for Advanced CSS

$399 (PPP available) | 40 hours to complete

A gold-standard learning experience that covers essential concepts along with advanced CSS topics, and goes deep into how CSS works through written and interactive tutorials.

Why It's Great

Multi-format tutorials keep the course engaging
Excellent explanations
Supplemental resources covering numerous topics
Aimed at professionals

This course is specifically tailored to professional JavaScript developers (familiarity with React, Angular is a must) to help solidify key concepts in CSS and take your knowledge to the next level.

Throughout the course, Josh uses a variety of formats, from in-depth written tutorials with interactive examples, to exercises and interactive quizzes, and guided projects.

It's an incredibly polished, highly intentional curriculum. While it's certainly a high-end learning option, if you're serious about getting great at CSS, and are already proficient with JavaScript, this course will take your skills to the next level.