Getting the most out of programming tutorials

Photo by Christina @ wocintechchat.com on Unsplash

Let’s talk about tutorials. Love them, hate them, they are everywhere and here to stay. From newbie developers to seasoned veterans, we all use tutorials from time to time.

In my experience, tutorials can be an excellent place to start when you’re learning an unfamiliar language, framework, or technique. Often they are one of the fastest ways to get a basic understanding of any material and to get something up and running quickly. However, they aren’t necessarily built for maximum learning. Like most things, you’ll get out what you put in.

The question then becomes, how can you get the most out of a single tutorial? Are there any tips and tricks? How can we be efficient about it all?

As an avid tutorial taker, here are some tried and tested methods to getting the most out of any single programming tutorial:

  1. Type everything out manually – No copy and paste, in other words. Take the time to actually type out every single line of code that you need. The reason being is that you’ll learn better the more time you spend with the material. And the more that you’re able to commit to memory, the faster you’ll be at it all. 
  2. Create a glossary – Highlight any unknown terms and then make a point to google them later. Summarize your findings in your own words in a sentence or two. Keep a record of what you learned. Update it as you go. 
  3. Do a line by line analysis of the code – Make sure you understand every step and that the syntax makes sense to you. Or if something is confusing to you, make a note to come back to it after. If at the end of the tutorial you’re still confused, try looking up the topic using other resources. Still stuck? Ask someone! You may even be able to reach out to the author of the tutorial for help. Other people are usually happy to clear up points of confusion for you!
  4. Keep a log of your progress – It doesn’t have to be super detailed. You could use Twitter, a blog, or even GitHub for this. I’ve even heard of people that write entire novels with GitHub, for instance. 🙂 But the important part is just to spend a few minutes recording what you did. If nothing else, it’s a great way to see how far you’ve come.
  5. Preview the martial – Before beginning a tutorial, spend some time previewing all that you will be covering. Skim the article, look at any pictures or diagrams, and consider what you already know about the topic. This helps to prime your brain so that when you actually do the tutorial, you’ve already laid the tracks for it (and you know what’s next!). Win, win!
  6. Work ahead of the tutorial – This one is more applicable the more advanced of a student and developer you become, but to the best of your ability, try to plan out or work out a solution to the problem before reading through the answers. Read the next topic headline and spend 10-15 minutes seeing if you can plan an approach. Or better yet, see if you can preemptively come up with an entire solution. At worst you end up getting stuck (see Tip #8). You now know where your knowledge limits are and what topics to review. And at best, you either have one or two outcomes. 1) You will have discovered another way to solve the problem that the author didn’t show. Very cool and empowering! Or 2) you will have solved it in a similar manner to the author and have thus taught it to yourself in a more engaging way. You’ll come away not only with the additional knowledge but a nice confidence boost to go with it. Whatever the case, you will have learned a lot in the process. Give it a go next time!
  7. Quiz yourself – this is something you can do throughout the tutorial or lesson, but do your best to commit concepts to memory. Research has shown time and time again that active recall is a key step in efficient learning. It will help you develop mastery of any new material. Bonus: Test yourself using your newly created glossary by creating flashcards. Lots of options here.
  8. Get stuck – Okay, hear me out. This one’s a hard sell but honestly, when I’m trying to learn new material, one of the greatest gifts I can have is getting stuck. I’ve learned to appreciate it even if it’s frustrating. Here’s why: Getting stuck forces you to really think. One of the major issues with tutorials is that they allow certain parts of your brain to shut off. You are simply following directions, like with a recipe. Getting stuck, on the other hand, is a surefire way of snapping yourself out of that. Use these moments to your advantage to really go deep on a topic.
  9. Take breaks when you need them – Completely stuck? Take a 20-minute break. Nap, eat, stretch, walk, shower, whatever you like. You’ll be surprised at how your brain may supply solutions and help you get unstuck. 
  10. Create a personalized cheat sheet – Make a summary of the tutorial once you’re done with it and fill it with the information you’ve learned. Include some code snippets and some high level concepts. If you can, also add in a 3-4 bullet point overview. Thanks to the Practicing Developer for this tip! 

That’s all for now!


Questions for discussion:

  1. What are your thoughts on the value of tutorials? Do you find them helpful? Why or why not?
  2. What study tips have worked for you, especially when covering new materials?
  3. What do you do when you get stuck on a tutorial? How do you get yourself unstuck?

I welcome your feedback. If you enjoyed this article or if you have any questions or concerns, feel free to contact me on Twitter or write to me in the comments section below. Thanks for reading! 🙂

Need help finding your next code project? Start here.

So you’ve completed a tutorial, or maybe even an online class. You’re really excited about it all! In fact, this is a big milestone in your developer journey & career! You should be proud!

However, after the smoke settles and the fireworks are gone, you might be left with the unsettled feeling of… what comes next? Where do I go from here? 

So first off, congratulations! You’ve reached a turning point. This is an awesome time to take some time out to reflect on where you’re at and where you want to go– to look over the project you just made and the skills you hopefully just learned! It’s also a good time to reevaluate your priorities and the direction you’d like to go.

But once you’ve done that, what do you do? If you’re out of ideas or unsure, here are some suggestions: 

  • Recreate the same tutorial project from scratch. You already took the tutorial, but now you need to test yourself to see how much you actually retained. No cheating on this one if you can. Only look at the answers if you get stuck for more than 15 minutes. Set a timer if you have to. If you can figure it out, great! You just learned how to figure it out yourself. If not, that’s great too! You just learned what topic you need to review more of– also a valuable lesson!

    Studying in this manner will test your active recall and problem-solving skills in a relatively safe, low-risk manner. After all, you can always look at the tutorial since the material is still there! Win-win!
  • Add additional features to the tutorial project. There are so many possibilities here. You could redesign the UI, hook the project up to a database, add authentication, etc. If it’s a game, you could try adding a multiplayer feature, a timer, a scoring system, or a save feature. The sky’s the limit here. Challenge yourself to modify the tutorial so much that someone wouldn’t be able to tell it’s the same project as before.

    This sort of exercise will test your ability to add/build on to an already existing project. It’s also relatively safe because you’ve already got something working! It may sound boring to repeat the same material, but there’s no better way to make sure you’re truly “getting it”!
  • Create a new project from scratch using the same concepts that you’ve just learned. Recreate a similar project to the one that you just made, but modify the content and core of it somehow. So if you just made a to-do list app using arrays, try building something that also uses arrays, but in a different way or for a different purpose.

    A new project using the same concepts will test your ability to apply the concepts you already know to a new project.
  • Create your own chimera/hybrid project using the material from two or more tutorials. Have you taken more than one tutorial recently? If so, try combining them into a single project!

    This type of project will stretch your ability to synthesize material from multiple sources.
  • Recreate someone else’s project. Or, mimic an app you already use on a regular basis – Create a simplified version of Instagram, Twitter, Yelp, Pinterest, etc. Or pay homage to a favorite developer that you have by studying one of their projects.

    This will test your ability to start creating projects independently but also your ability to study and observe already existing software. It might also give you a newfound respect for someone whose work you already admire!
  • Find a programming concept that you’re still learning and design your own app about it. Just learn about linked lists or queues? Try building something with that knowledge! Or, if that’s still too hard, spend some time brainstorming possible use cases for how you might be able to apply that concept in a future project. You never know what’ll show up later down the road! 

    This type of project will test your knowledge of core programming concepts & also help you learn how to build apps independently.

Still need ideas for a new project? Use an random idea generator! Or try creating your own idea generator tool! 🙂


Questions for Discussion

  1. Do you have a favorite way of studying & learning new material?
  2. How do you keep your knowledge fresh after you’ve finished a tutorial or class? Do you ever set aside time to review?
  3. What sorts of projects have you gotten the most mileage out of? What projects were the most fun?
  4. For more experienced developers- If you were starting out in your dev journey again now, what would you recommend to someone who was in your shoes?

I welcome your feedback. If you enjoyed this article or if you have any questions or concerns, feel free to contact me on Twitter or write to me in the comments section below. Thanks for reading!

Learn to Code Online: Free and Budget-friendly Resources to Get Started With

Quick Summary:

Hello world! 🙂 first blog post after a long hiatus!

I wanted to share a curated list of free & budget-friendly resources for learning to code.

The focus of this link collection thus far is on web development and python, but you’ll find plenty of opportunities to branch off to other languages too. I’ve also included a number of resources related to data science as well as data structures & algorithms. Whether you’re new to the world of coding or simply looking for more resources for practicing, I hope you find what you’re looking for!

If you would like to contribute to this resource list or have any recommendations, let me know in the comments below.

Table of Contents

| For Adult Learners| For Younger learners |

| Data Science | Data structures & algorithms |

| Communities & Support |

For Adult Learners:

These websites & tools should work for most learners.

W3Schools

https://www.w3schools.com/

Description:  Created originally in 1998 by a Norwegian company Refsnes Data, W3Schools is a collection of free resources & tutorials for web development.

My note: It’s a great tool for looking up various code snippets.

Mozilla Developer Network (MDN)

https://developer.mozilla.org/en-US/

Description:  A collection of resource & reference guides for developers run by the Mozilla Foundation, a nonprofit organization.

My note: This is run by the same folks that develop the Firefox browser!

freeCodeCamp.org

https://www.freecodecamp.org/

Description:  Founded by Quincy Larson, freeCodeCamp is a nonprofit learning hub & community that teaches people how to code.

My note: Great series of exercises for getting started with web development. I regularly send my students here if they express an interest in web development.

Codecademy

https://www.codecademy.com/

Description:  Codecademy is an online learning platform that teaches a variety of programming languages in browser including Python, JavaScript, and Ruby. 

My note: Many of the courses require a paid subscription, but it could be worth it depending on what you’re looking for.

Scrimba

https://scrimba.com/

Description: Scrimba is an interactive screen cast tool created by Scrimba AS in Oslo, Norway. Follow along with tutorials in the browser with this interactive tool / development environment.

My note: What makes this one noteworthy is that it allows you to stop the video at any time & edit the code via the editor.


For Younger Learners:

These are some helpful interactive tools & sites directed at getting younger students interested in coding. They might also be useful even if you’re an adult learner as they typically assume no prior knowledge or experience.

Code.org

https://code.org/

Description: Code.org is a nonprofit that provides K-12 computer science education for schools. 

My note: Most of the kids that I work with have used this site at some point or another. My favorite tool is the App Lab, which is a sandbox tool for developing mobile applications. Many of the students also enjoy it!

Scratch

https://scratch.mit.edu/

Description: Scratch is a block based coding tool that is aimed at teaching children to create interactive media, stories, and games. Scratch was created by the Lifelong Kindergarten group at the MIT Media Lab. 

My note: Scratch is what we introduce the younger kids to when they first start learning to code. Some features that I particularly like about Scratch is that you can remix and see inside all of the projects. They’re all “open source”. 

Trinket

https://trinket.io/

Description: Trinket is a coding & learning environment designed for kids, with a focus on Python. 

My note: We use this one often in the classroom. The Hour of Code is a great way to introduce kids to programming using typed languages (as opposed to block languages). I also like that you can create games with Pygame (https://www.pygame.org/) in the browser!

Khan Academy

https://www.khanacademy.org/

Description: Khan Academy is a nonprofit organization founded by Sal Khan in 2005. It’s dedicated to providing learning resources in a variety of different topics.

My note: KhanAcademy is primarily known for its extensive math curriculum, but they also have a section for Computer Science & Algorithms. Worth looking at!

CodeCombat

https://codecombat.com/

Description:  CodeCombat is a game-based education tool designed to teach students computer science concepts in JavaScript & Python. 

My note: CodeCombat is a great option for students who need a little more excitement / interactivity while they learn. 

WoofJS

https://woofjs.com/

Description: WoofJS is a coding tool in JavaScript for kids designed to bridge that gap between Scratch (block-based) & typed languages. 

My note: It’s a fun tool to use and allows some of the features of Scratch (drag and drop) but also stepping things up a bit in terms of difficulty. Great site for making simple games.

P5.js

https://p5js.org/

Description: p5.js is a JavaScript library developed by Laura McCarthy. Notably, it was designed to be accessible and inclusive to new developers.

My note: This is a great tool for younger coders who want to get started making sketches and digital art.


Data Science

Kaggle

https://www.kaggle.com/

Description: Kaggle is a data science community with a number of open source public datasets. They also have tutorials & guides for learning python, machine learning, and pandas.

My note: I’ve used this site briefly, but not extensively. They regularly host a number of competitions. While I haven’t participated personally, I’m sure trying it out would be a great learning experience.

R for Data Science

https://r4ds.had.co.nz/

Description: This is a free to use online textbook developed by two authors Garrett Grolemund and Hadley Wickham that will introduce you to R and other related data science packages.

My note: Recommended by Brian (@ThatPhageGuy) on Twitter as a great resource for learning about R and Data Science. Looks good to me!


Algorithms & Data Structures:

These sites are largely geared towards candidates looking for interview preparation materials. However, they also double as good resources for learning about algorithms & data structures.

Algorithms (Coursera)

https://www.coursera.org/learn/algorithms-part1

https://www.coursera.org/learn/algorithms-part2

Description: A free two-part course series for learning about data structures & algorithms taught by two Princeton University professors Robert Sedgewick and Kevin Wayne. The language of choice for the course is Java, though the concepts can be applied across languages.

My note: I haven’t taken this course, but I’ve heard it recommended from several sources.

Visualgo

https://visualgo.net/en

Description: A visualization tool for learning about various algorithms created by Dr. Steven Halim for his students.

My note: Very helpful site if you’re new to algorithms. It also features a few training tools & quizzes!

HackerRank

https://www.hackerrank.com/

Description: HackerRank is a well-known site that has learning tools for practice coding & interview skills.

My note: I’ve been recommended this resource a few times, and it seems to be a favorite for helping students practice for interviews. Like the Coursera course, the language of focus is Java. They have support for other languages too, though.

Coderbyte

https://www.coderbyte.com/

Description: Another site dedicated to improving your coding & interview skills. It features challenges & courses.

My note: I haven’t used this one specifically, but I’ve heard it recommended a few times. I may give it a go eventually and update this listing.

Codewars

https://www.codewars.com/

Description: Designed to mimic a dojo, with Codewars you participate in a series of online coding exercises at various skill levels / kyu.

My note: I’ve personally used this one as my go-to for programming-related exercises. If I had a complaint, it would simply be that some of the challenges aren’t terribly moderated. So, the questions may be poorly worded or confusing. The upside is that they offer the challenges in multiple different languages.

Interview Cake

https://www.interviewcake.com/

Description: This is a popular subscription site directed at helping engineers get better at technical interview questions.

My Note: To get access to all of the content requires a yearly subscription. It might be worth it if you’ve got an upcoming interview or exam.

Communities & Support:

There are lots of developer communities out there, some of which are more supportive of beginners & newbies than others. I’m listing the ones I’ve had personal experience with or others have vouched for.

DEV

https://dev.to/

Description: DEV is a open source community dedicated to collaborative learning founded & run by developers Ben Halpern, Jess Lee, and Peter Frank.

My note: DEV has an amazing community and countless development-related articles that are published around the clock. Be sure to check out the “Top 7 Most Popular DEV posts” listings for some great starting points.

CodeNewbie

https://www.codenewbie.org/

Description: CodeNewbie is a community of programmers & other people learning how to code. It started as a biweekly TwitterChat by developer Saron.

My note: Very supportive community. They also have a podcast!

Indie Hackers

https://www.indiehackers.com/

Description: An indie hacker community run by Courtland Allen. It has a full collection of resources & articles directed at helping others build online businesses & side projects.

My note: I don’t have any personal experience with this one yet, but it seems to be a great resource & community. Recommended by Fiona.

WomenMake

https://womenmake.com/

Description: A community created for women entrepreneurs. Created and moderated by Marie DM.

My note: I can personally vouch for this community as well! It’s not specifically directed at programmers, but you’ll find plenty of resources here. Marie is very welcoming. 

The Bit

https://thebit.tech/

Description: This is a free tool that matches self-taught learners together to complete online courses.

My note: I haven’t tried out this service personally, but it looks like it could be useful!