# I learned to code from scratch in 1 year. Here's how.

## Метаданные

- **Канал:** Thomas Frank
- **YouTube:** https://www.youtube.com/watch?v=NpUuuT_EzSs
- **Источник:** https://ekstraktznaniy.ru/video/23889

## Транскрипт

### Segment 1 (00:00 - 05:00) []

In this video, I'm gonna show you how I learned to code from scratch in just one year. I'm gonna show you the exact path, learning resources, tools, and most importantly, the learning hacks that I used to go from a complete beginner to a self-taught programmer building and shipping complex apps and workflows that are now used by thousands of people, so you can do the same thing if you want to, or maybe even get a job as a programmer if that's a goal you have. We're also gonna talk about two secret weapons that I use both to learn faster and to build and ship things much more quickly as well, and one of those has even become a surprisingly good source of side income for me, and I think represents a pretty interesting side hustle opportunity even for people who are not expert level coders, but I'll talk about that later on in the video. First, here's an outline of everything we're gonna cover here. I'm gonna try to make this as comprehensive as possible so it's a jumping off point that you can use if you want to learn how to code, and we're gonna talk about how I picked my language, how I got started, the exact learning resources that I used, all of which are completely free, by the way. We're gonna talk about those two secret weapons I mentioned, a few learning hacks I used to learn even faster, and some of my favorite programming tools. Feel free to skip around this video all you like. I have timestamps in the description down below. We're gonna start off with a bit of a discussion on how I got started and how I chose my programming language because one of the most common questions people have when they want to learn how to code is what language should I start with? So personally, I started with JavaScript, and I focused specifically on what's called backend programming, and backend programming has to do with everything that happens sort of under the hood or behind the scenes, whereas front-end programming has to do with the actual interfaces and controls that you actually interact with on websites and apps. So think of backend coding kind of like designing or building a car engine, whereas front-end coding would be like designing the car body itself, but also the controls like the steering wheel or the ejector seat button. So for example, my favorite project that I built so far, also vastly the most complex project I built so far, is called Notion Voice Notes, and it's a few thousand lines of code that essentially take an audio file like a lecture recording or voice note or a podcast, transcribes it to text, summarizes that text with AI into lists like the main points and the action items, and then creates a brand new page in my Notion note-taking system with all of that detail. So I can basically take notes with my voice. And to interact with that system, all I have to do is upload an audio file to Google Drive, and then everything happens automatically in the background. That's what I mean by backend coding. And I'm telling this story because that workflow, taking notes with my voice, is actually one of the primary inspirations I had to learn how to code in the first place. I have wanted to be able to take notes with my voice for years. I go for a lot of long walks, and I've always wished I could just record a voice note and then get like a perfect transcription later on that I could read through, skim, add highlights to, all that good stuff. And then literally in the airport on the way to my honeymoon after getting married last year, I came across a blog post in line for coffee by somebody who was using JavaScript and a few other free tools to transcribe podcast episodes to text. And as I was scrolling through that blog post, I couldn't understand any of the code in it at the time, but I was confident that if I could come to learn enough JavaScript to understand that code, I would be able to modify it and build my voice note-taking workflow. So the choice for me was clear. I needed to learn JavaScript. There was another reason as well. I wanted to send my notes to Notion and the Notion API is primarily use the JavaScript. That made the choice clear for me. And if you're watching this, if you're confused about what language you should start with note that I'm not telling you, you should start with JavaScript, but I am the same kind of inspiration. You should pick a language that will let you build something that is interesting to you personally, because at the end of the day, programming languages are just tools. So if you're just saying, I want to learn how to code, it's kind of like use a hammer and yeah, I can get a loose piece of two by four and have some nails sticking out of it. I can teach you how to swing a hammer, but you're going to have a lot more success if you start with something that you actually want to build. Like I want to build a house or computer, because once you have the project in mind, you're going to know what tools you actually need for it. So once you understand the project, you're going to understand what tool you should pick, but you're also going to learn a lot faster for a couple of different reasons. First, having a goal in mind, having something that you're interested to build is going to focus your attention because programming languages are full of tons of different subskills and methods and classes, and you kind of have to know which ones to learn and focus on at first. Otherwise, you're going to be very, very scatterbrained. The other thing, the more important thing is when you have an end goal in mind, your brain is going to understand that what you're learning, even if it's kind of boring in the moment or on its own, is relevant to something you care about. So it's going to be stickier. You're going to retain it much more easily. Now, there are some other factors that go into language selection, like the popularity of the language, how competitive it is in the job market if you are trying to get a job as a programmer, the difficulty of learning language in general. And there's a whole great post on Free Code Camp's website that goes through these considerations and talks about them. I'll link to that in the description below. But the really nice thing about starting with a language that's going to help you build something interesting in the short term is once you learn that language, if you have to learn a second language in the future, it's going to be much, much easier. And the reason

### Segment 2 (05:00 - 10:00) [5:00]

for that is that we can break programming down into two general categories of sub-skills. We have language-specific sub-skills, so things like the syntax of the language, its quirks, maybe the frameworks or tools that you use to work with that language. But then we have a much bigger category of universal programming skills, so things like data structures, working with functions, just the logical practice of solving problems with code. And once you kind of hone your skills in this category with your first language, you take those skills into your second language and all you have to do is kind of apply them to the syntax and the quirks of the new language. So learning a new language, if you have to for a job or anything else, is going to go way, way faster than learning your first language. And speaking of learning, let's now talk about the learning resources that I use to learn JavaScript. So the main one that I'm going to recommend for anybody who does want to learn JavaScript, which I think is a great first choice if you are interested in building web apps or doing backend programming like I do or building websites, is this JavaScript algorithms and data structures course on freecodecamp. org. Like I said, everything in this learning resources section is completely free and as the name in free code camp implies, this is a completely free course. I also think it is absolutely the best beginner resource for anybody trying to learn JavaScript. And the reason for that is there are tons and tons of mini lessons in this course. There's a whole bunch of modules here and every one of them has a bunch of different mini lessons. Each one of those mini lessons is kind of a self-contained challenge. So you're immediately having to write code while you're learning. So for example, we have understanding uninitialized variables right here. It gives you a little bit of a lesson on what it's trying to teach you. And then it immediately asks you to write code and it has a button where you can run tests and see if your code is actually right or if there's a bug in it. So this immediately gets you writing code instead of just like reading theory or going through a book. And I think that is the best way to learn any programming language, not just JavaScript. If you can get your hands dirty and start coding right away, you're going to learn a lot faster and you're going to be a lot more motivated to keep learning. Now, before I go on to the next learning resource that I want to recommend here, I have two little tips, things that I did with this course that I think are worth mentioning. First and foremost, alongside this course, I had a little test folder in my own programming editor. I use VS code right here. And basically when I would run across a particularly interesting lesson, I would try to take the lesson and remix it and challenge myself to go do something different with it. So for example, if the lesson was teaching me how to write a really basic for loop, or just prints out one, two, three, four, five, et cetera, I would go into my editor and challenge myself to kind of up the ante a little bit instead of going one, two, three, four, five. What if I skipped every third number or what if I went just the even numbers in doing that is a great way to take a challenge that's just a tutorial challenge, something that someone else has laid out for you and turn it into something that you have more ownership over and something that you care about more. In business, there's this idea called the Ikea effect where people have more affinity. They're more proud of the furniture they own from Ikea because they had to actually go through the process of building it themselves. This is also applied really successfully in video games like Minecraft, even in software like notion. I think a big reason people love notion is they get to build stuff and be proud of it. And when you're learning programming, you can use this concept to your advantage. You can take the tutorials and take the concepts they're trying to teach you, remix them a little bit and kind of turn it into play almost. The second thing, and this is going to be kind of controversial that I did here is I went through, if I go back to the free code camp course, I went to the basic JavaScript module, which is 113 lessons. Then I went through the ES6 module, which is 29. And then I actually quit the course. I didn't go through this regular expressions module, the debugging. I didn't go through any of these because ES6 and basic JavaScript taught me enough to go off and build the thing I wanted to build at the time. I had two kind of main inspirations. The first we already covered, which was me wanting to build a voice notes workflow. The other one is I really wanted to teach the notion API over my second channel, Thomas Frank explains. And I had this really fun project idea that I wanted to build. I wanted to make an automated Pokedex generator where I would pull Pokemon from an API and bring them in automagically. And after going through those first two modules, I felt that I had enough knowledge and I had enough tools in my tool belt to go off and start building that. I also had enough knowledge to now go out and look through references, look through kind of like reference resources and figure out things that I didn't know without having to go through a structured course. So one thing that I would recommend that you follow, something that I do all the time is no matter what kind of educational resource you're going through, don't feel that you have to complete it 100% before you can go off and try doing your own stuff. Instead, think of the educational resource as a reference. Maybe you need to go through the first few modules to sort of just get your feet wet and understand the basic language of the skill you're learning. But then if you get inspiration, if you want to go build something

### Segment 3 (10:00 - 15:00) [10:00]

don't feel that you have to complete the entire course before you can go do that. Let the inspiration carry you. Okay, so I went through the JavaScript algorithms and data structures course. That is the main resource I would recommend here. The next one is the modern JavaScript tutorial, which you can find over at JavaScript. info. So this I think is a great compliment to that free code camp course because where that one is a little bit light on explanation and heavy on exercises and actual coding, this is the exact opposite. So let's say I searched for arrays here. I think they'll probably have an article on arrays within this. Here it is. This is basically a really well-written online free book that basically can teach you everything that the other course isn't teaching you. So if you're going through an exercise in the course and you want to kind of understand the concept that's teaching a bit more, the modern JavaScript tutorial is my number one resource recommendation for going through it. There's also an actual reference guide, which I'm going to cover next, but I think the modern JavaScript tutorial is a bit easier to read. It's a bit more fun to read. So consider that to be an important tool in your programming, especially JavaScript-focused tool belt. And the third one that I'm going to mention, which I think makes up the trifecta of the ultimate JavaScript learning resources, in my opinion, is the MDN Web Docs. So these are basically like the de facto official documentation for JavaScript and for a lot of web technologies actually, but they have this whole JavaScript kind of guide you can go through. I think you could actually learn JavaScript going through just this website, but the real strength here is any sort of function that you're trying to use or piece of language you're trying to understand, there is comprehensive documentation on it on this website. So for example, there is a function I use all the time called map, and right here, array prototype map, they have a whole article on it. They have a demo, they have syntax, they have parameters, and most importantly, they have examples right here. So if you want to understand how to use a function like this, you would go to the MDN Web Docs. And for that reason, I would recommend keeping this in particular as a bookmark resource on your computer. A couple others that are worth mentioning. First, there is a weird JavaScript course by Fireship on YouTube, which I think is really, really fun. It's kind of like a high level overview of JavaScript and all of these videos are super entertaining to watch. Highly recommend watching those and also just subscribing to Fireship in general. He has some of the best programming content on YouTube. And then the last learning resource I want to talk about here isn't anything in particular, it's more of a general recommendation to kind of just let yourself get obsessed with coding. If you feel the interest, just sort of like start learning by osmosis. So this is something that I definitely did as I was watching through videos like Fireship here on YouTube, I started to notice that my recommendations had more and more stuff about JavaScript. And so a lot of times if I was like eating dinner or lunch or something, instead of going to Netflix or watching a movie, I would watch programming content on YouTube instead and just sort of learn by osmosis. For example, when I was going through this Fireship course, my YouTube algorithm took notice and started recommending me lots and lots of JavaScript related content on my home feed. One of those videos was this video right here on what the heck is the event loop anyway by Philip Roberts. And I just watched that while eating dinner one night. And now I have a much better understanding of how asynchronous code works in JavaScript. I probably wouldn't have even thought to look that up in the first place, but it was just recommended to me and I watched it and I'm really glad that I did. Okay, so it's now time to go into secret weapon number one in this video. And that secret weapon is chat GPT, but probably not in the way that you think, because a lot of people, especially a lot of people that I follow on Twitter or that end up in my feed will say chat GPT can write code for you. We have GitHub copilot, which uses chat GPT to basically generate code on the fly. And if you're already a professional programmer, that can be a great way to boost your productivity. But if you're trying to learn how to code, letting chat GPT write code for you is actually a bad idea because you are not going to come to understand how that code is actually working. You have to write it yourself. So what I did instead was I use chat GPT as a learning tool. And I came to discover that it has two major strengths that the courses and reference materials that I was using primarily kind of lack. The first one is that chat GPT can tailor the level of the material that it's generating for you on the fly to your specific needs. Something like a course or a reference guide can't do that because it's written for lots and lots of people. Whereas with chat GPT, you can say, Hey, I didn't quite understand that. Could you give me some more examples? Could you bring this down to say like a 10th grade level, something like that. So for example, I have a one piece of history here where I was asking, what is a set? Can you teach me about it? And how running the has function in it is more efficient than some alternative. I can't remember what the context was, but here it basically generates a mini article for me. And if this wasn't enough, I could ask for more examples or more guidance just to make sure that my understanding was clear. The other thing that I've learned with chat GPT is it is fantastic for eliminating what's called a second order incompetence, which are basically the things that you don't know

### Segment 4 (15:00 - 20:00) [15:00]

literally the stuff in a skill that you just don't even know exists yet. And I found that if you prompt it right, chat GPT is really good at helping you discover these kinds of things. So just to give you an example here, here's one of the prompts I gave it. I gave it a function that I wrote myself and I said, here's a function I wrote that fetches Pokemon from the Poke API, creates an array of objects with their data. You don't have to worry about what this code does in this video. This isn't a technical level video, but this is key. How would a senior JS developer improve this code? And then I said, for each suggested improvement, please explain why you've suggested it as if I'm a student unaware of it. So I pasted my code below the prompt here as context. And then it gives me a whole list of suggestions here. Use promise. all for concurrent requests, refactor error handling, separation of concerns. And a lot of these concepts, the first time that I wrote a prompt like this, I had no idea existed. For example, this concurrent requests suggestion here, I didn't know what that was. And it turned out to be one of the most useful concepts I ever learned as a programmer. And I'll just take a little bit of an aside here to explain it. So a lot of what I do with my programming is I write code that reaches out to APIs and then gets responses. So for example, if I want to get a Pokemon from the Poke API, I have to make a request and then I have to get the response. So if I wanted to get say a hundred Pokemon, I might write a loop, which is one of the first things you learn about as a programmer. And it would do it as many times as needed, reach out, get the response, then kick off the next iteration, reach out, get the response, and do that a hundred times. When I learned about concurrency, I learned that you can basically write code that will reach out and it doesn't have to actually wait to get the response before it will send the next request. And just to show you an example of how powerful this is, over on a platform called Pipe Dream, which spoilers is my next secret weapon, but I'm going to show you here. I wrote some code to show just how much faster concurrency can be than what's called serial programming, where we're just waiting for the response before we kick off the next iteration of our loop here. So I wrote some code that grabs the first 50 Pokemon, both in serial and using concurrent code. And we can see here to get these 50 Pokemon names with serial calls, it took seven seconds or 7,000 milliseconds here. Whereas the concurrent calls doing the exact same thing only took 530 milliseconds, just over half a second. So we get this massive speed increase just by implementing concurrency. And again, I didn't know about that at all. I didn't know it existed as a concept until I asked that magic question. How would a senior JavaScript developer improve this code? And then please explain the suggested improvements. Now I could probably do a whole video in the future on Chat GBT. I've used it for a lot more beyond coding. What I will say to wrap up this section is still realize that Chat GBT can get things wrong. So it is really important not to lean entirely on Chat GBT as a teaching tool. I truly believe you should go through courses and get very familiar with the official documentation at the MDN Web Docs, and then use Chat GBT as a support tool that supports those official resources. That brings us to secret weapon number two, which I've already showed you a little bit in this video, but the tool is called Pipe Dream. And it's kind of like Zapier or make. com. It's like a no code automation tool that allows you to sort of hook up different tools together. But the real difference between Pipe Dream and something like Zapier is Pipe Dream makes it super easy to write JavaScript code that can actually support your workflows. And you can even bring in packages that make your code even more powerful. And the reason that I'm listing this as a secret weapon is I have found Pipe Dream allows me to build and ship really useful workflows incredibly quickly. And that actually encourages me to go off and do it. One of the biggest blockers that kept me from learning programming for a very long time was all the infrastructure and all the extra stuff around the actual code that you want to write. Traditionally, if you want to ship an app, you got to write your code for the app, but you also have to get servers. You have to think about authentication. OAuth for APIs and all kinds of stuff like that. And the beautiful thing about Pipe Dream is it's a platform that basically takes care of all of that for you. So if you're like me and you're very focused on backend programming, where you're sort of like building little machines that automate work between different tools, Pipe Dream makes that incredibly fast. And I want to show you an example in this video, just to show you how powerful this tool can actually be. So here I have a very simple workflow set up, which is called audio to Notion. This is basically the exact same thing I talked about in the intro where we are uploading an audio file to Google Drive, and then we're transcribing it and sending the transcript to Notion. And currently I'm using only no code components. So we have a trigger here. It's going to then download the file to what's called temp storage. We're going to connect with OpenAI to transcribe the audio file to text, and then we're going to create a brand new page and a note-taking system in Notion that has that transcript. So here I've got that note-taking system, I'm just calling it voice notes. And if I go ahead and test this workflow right here, we get a success message after a couple of seconds. And if I go back over to Notion, we see voice sample. mp3. I can open that up and you can see

### Segment 5 (20:00 - 25:00) [20:00]

we have a full transcript of an audio file that I recorded. And you could do this in a traditional no code automation builder like Zapier or make. com. But there's one problem that I see with this transcript. It's a wall of text. There's just so many lines of text here. I would love if this was broken up into paragraphs, but unfortunately the no code components in Pipedream don't have an option to do that. So that is where adding code into the mix becomes really, really useful. And the way we can do that in Pipedream is just by adding a step and choosing the node step right here. So node JS, if you don't know about it, is what's called a backend runtime for JavaScript. It basically lets you run JavaScript outside of just the browser. You can run it on servers, almost like a true backend language like PHP. And here we can use it to basically write code that acts as glue to do extra stuff within our workflows in Pipedream. So I'm just going to grab a hello world component right here. And I've prepared some code that I'm just going to copy and paste directly into the step. Again, this is not meant to be a technical video, so you don't have to worry about what this code is doing or how it works. But basically, we're importing a really powerful library called natural, which can split our transcript into sentences. And then I have some simple code here that is going to basically make groups of two sentences per paragraph. So if I test this out, you can see what it does. And you can see here on the return value area, we now have our transcript, but we have some line breaks between these groups of paragraphs. So if I copy this path here and I come down into our create page from database, no code action, and I basically replace this page content call with that variable, we can test it one more time. And once again, we get a success message. We can go back over to Notion and now we can check out this brand new page. And would you look at that? We have actual paragraphs and each paragraph is an individual block inside of Notion. So that is really what code can allow you to do. Once you kind of come up against the limits of no code platforms, a platform like Pipe Dream basically says, "Hey, write your own code, work around those limitations, and you can build a workflow that does pretty much exactly what you want. " So I started using Pipe Dream in that capacity. I was building no code workflows and then adding little, little snippets of code just to sort of add things that I wanted. And over time, I got more and more involved in the platform to the point now where my Notion voice notes automation actually works on Pipe Dream. That is where it lives, but it is entirely based on code. Nothing is using a no code component at this point. And I wrote probably 2,500 lines of code over several months to make this entire thing work. And that's actually the reason that I am listing Pipe Dream in this video, even if you are not a backend focused developer, because it represents a concept that I think is very important for learning how to code. And that is the removal of friction. Like I said before, I was originally intimidated by all the extra stuff you have to do around coding, like authentication, security, servers. Finding a platform like Pipe Dream basically gave me a tool where I could just write simple code, write the code that I knew how to write, and get something that actually worked and did something interesting. And that gave me enough momentum. It gave me a result that pushed me to keep improving my scripts until eventually I was coding entirely code-based scripts that weren't using no code components. And now I'm to the point where I actually do understand things like authentication and servers. So if I wanted to go ahead and turn this into a non-Pipe Dream based workflow, if I wanted to build a full stack app on it, I'm now much better equipped to do that. And I don't think I would have gotten to that point quite as quickly without an interim tool like Pipe Dream. Now in the intro, I also mentioned that one of those secret weapons has become a source of side income for me and represents a pretty interesting side hustle opportunity. That actually is Pipe Dream as well. And I want to show you exactly why. So first and foremost, Pipe Dream has a feature that a lot of other no-code tools do not have that I think is super useful. And that is this little share link feature right here. Essentially I can create this, I can choose some settings and I can generate a little link that when anyone clicks it, it's going to automatically rebuild this entire workflow in their Pipe Dream account. So it's almost like a Notion template. And the other thing Pipe Dream has is an affiliate program and a pretty darn good one at that because when people click through and actually upgrade to a paid account, the affiliate gets 33% of their payments for an entire year. Now Pipe Dream is also incredibly powerful on its free tier. So I've been working with their affiliate program for the past few months. And I think only 1% of the people who have clicked my affiliate link have actually converted to a paid account. But just that 1% of people, about a hundred customers so far, has generated $4,000 in commissions over the past few months. And that number is only growing every single month. So it's this really cool thing that I get to do where I get to basically build free software, share it with my audience, which I mainly do over on my second channel, Thomas Frank Explains, and a small portion of the people who use that software eventually upgrade to paid accounts, maybe their teams, or just have a lot of automation needs. And I'm able to earn

### Segment 6 (25:00 - 30:00) [25:00]

some income that way without having to actually sell anything. But if you're following along, you might be getting an idea here because these share links are kind of like Notion templates in a way. They're just links that kind of help you duplicate something that I've built. And if you've been following me on Twitter, you might know that a large part of my business these days is selling paid Notion templates over on my website. Well, I think you could do the exact same thing with Pipe Dream. You could either build bespoke workflows for clients. In fact, I've done that for Nebula. Or you could build workflow templates like the Notion voice notes template that I made, or Notion voice tasks template that I made. And you can actually sell those as useful paid software. I don't have the capacity to do that right now because I would want to offer support for it. It's just one of my values. But I think somebody who had a bit more time and a little bit of programming skill could really deliver value by putting together workflows in Pipe Dream and then selling them. So keep that in mind as a potential source of side income. At this point in the video, we are now going to move on to the next section, which is three of my top learning hacks for learning programming even faster. The first one is the simplest. Write code often. Write code as much as you can. And I'm saying this explicitly because a lot of people when they try to learn programming get caught up in tutorials and they watching learning materials. That's important, but it's much more important that you actually go write code and try to build things. And anything you can do to make the process of writing code easier for yourself, anything you can do to remove friction from that process, you should do. It is one of the main reasons I chose to feature Pipe Dream so prominently in this video because it's the tool that allows me to just spin up useful workflows really quickly where otherwise I might say, "Oh, that's too much of a hassle right now. I'm too busy. I'm not going to do it. " For example, a few months ago, I was on a Discord with some people and one person was like, "Man, I really wish I could pull Magic the Gathering card art into my Notion database. " And I was like, "There's a Magic the Gathering API. It's called the Scryfall API. I think I could whip up something really quickly in Pipe Dream that would pull the cards this person wants from Scryfall and put them into Notion. " So I built that in just about 20 minutes using Pipe Dream, gave them the share link and they were able to use it. And I learned a whole bunch of cool code tricks along the way because it was a new and novel challenge. If I didn't have a tool like Pipe Dream, I might not have taken that on because I only had about an hour of time worth in that evening to do it. And I will recommend another tool aside from Pipe Dream for this purpose and that's called Replit. So Pipe Dream is really about building automations between APIs. Replit is actually almost like a full coding platform in the cloud. You can write code in tons of different languages. You can actually run that code. You can deploy full apps. I've used it. I've even embedded some Replit embeds in some of my coding tutorials on my blog and you can literally run code in them. So definitely check that out because it's yet another platform that will allow you to spin up something very quickly. And again, it removes that friction from the process of trying something out or starting a quick project. Learning hack number two is once you start building projects that get pretty sizable, you want to have a testing folder aside from that project where you can write specific functions in isolation and test them. And I want to show you kind of an example here. So once again, to jog your memory, this is my biggest project. It's called Notion Voice Notes and it is absolutely massive. Now typically you probably wouldn't write code files this long in normal modern projects that use modern design patterns. My code is in one gigantic file here because I started on Pipe Dream and initially I was writing in the actual Pipe Dream app where you kind of have to have everything in one file. So I could split this up, but still this is a gigantic project and it has a lot of moving parts. And if I want to test something in the middle of the project, then the testing process can get really, really tedious and lengthy because it's sort of like handing stuff off to other functions. So instead, once you get a project around this size, maybe even a little smaller, you want to give yourself like a testing folder here. And this will essentially allow you to write small functions and then test them out directly to make sure they work before you plug them in to your bigger project. So here I have a very small function that is going to take a list of Pokemon objects and I can sort them by a specific criteria. So down here, just to point this out, I'm sorting my Pokemon object by their type. And if I run this code, I get an error and it says type is not defined. This is an example of quick iteration. Here I can immediately get my error. Whereas if I was writing this function in my giant project, I would have to go through this entire build process and it would take me a lot longer to get this exact error message. So here I get it right away. I can go, whoops, I accidentally forgot to put my quotation marks around this word type here. Let's go ahead and save the file. Let's run the code again. And do we get an error message this time? No, we don't. And we do see that we have our Pokemon objects sorted in reverse order by their type, water, grass, and fire. So again, give yourself a little test area where you can write functions in isolation and you're going to tighten those feedback loops and make much quicker progress. And speaking of

### Segment 7 (30:00 - 35:00) [30:00]

progress, learning hack number three is to build yourself a code snippets note, or maybe even a code snippets database. So I want to show you mine really quickly here to show you what this is here in my note taking system in Notion. I've got a note called code snippets. And basically whenever I find myself using a snippet of code all the time in my projects, I will create a snippet for it in this note. So I've got one here. This one's kind of a verbatious, I don't know if that's a word, but I'm gonna come down here to show you this one, import the Notion SDK into pipe dream. So basically if I want to work with the Notion API, there is this import statement. And then there's some specific code for creating an instance of a client that I can use to work with the Notion API. I often forget how to actually type this out. And that's kind of okay because memorizing coding syntax specifically for like libraries here is probably one of the least valuable skills you can have as a programmer, especially as AI starts to become more and more part of our workflow. It's much more important to understand the logic and the creative problem solving process. So here, if I need to import the Notion SDK into pipe dream, I'm just gonna come grab my snippet. I'm gonna paste it in, and then I'm gonna start coding from this base. And that is going to allow me to code much more quickly and spend a lot less time trying to remember, hey, how do I do this thing that I've done a million times before? It's all about efficiency. And speaking of efficiency, I wanna now talk about some of my favorite programming tools that speed up my workflow and basically make work a lot easier as well. The first one is what's called VS code or visual studio code. This is an editor, and there are a lot of editors out there. It's like sublime text. There's like Notepad++ if you're really old school, but VS code is kind of seen as one of the most popular, powerful out there. It's the one that I use. And for basically any programming language that you're working in, you can probably use VS code. And in particular, I want to point out a few different extensions that you can actually add to VS code to make it really powerful as a learning tool. So here in VS code, which is free, it's on basically all the major systems. I can open up my little extensions area and you can see that I have five installed. Code runner is the number one extension that I would recommend installing. I think you also need to install node. js, which is pretty easy. You can just go to the website, which I'll link below, install that on your computer. And the reason I love Code Runner so much is it lets you run code really, really quickly. I've already shown it in this video, but I'll show it one more time. Basically, if I clear the output here in the output tab, if I just right click and hit run code, it runs the code and I can see the results any errors if it's going to throw an error. So this is the fastest way to just run a snippet of code, get an answer and tighten those feedback loops. There's another extension that does a very similar thing. It is called live preview. And this one, instead of basically outputting the results of your code in this little output tab here, actually creates like a mini browser window inside of yes code. So this can be very helpful if you're actually writing HTML around your JavaScript. So just like before, I have this very simple HTML file, but we have this Pokemon sorting function that I've built here. And if I just click this little preview button right here, I can actually see what the table is going to look like inside of a mini browser window. And the cool thing about this extension is it will automatically update if I change the code. So let's say I come down here and I change my sorting criteria from attack to, let's say name. Now we can see it is sorting by name in reverse order. If I remove this reverse call here, now it's sorting in alphabetical order, ascending order. And again, this is just a super quick way to iterate on your code, make changes and actually see the results in real time. Another extension that I highly recommend that is a great learning tool is called Quokka, quokka. js right here. This will basically execute code directly inside of your editor on a line by line basis. So to show you an example of that, I've got this loop test. js file here. It's doing something very, very simple. It's just doing a 99 loop here. Then it's basically just printing 99 bottles of beer on the wall, 98, 97, et cetera. And you can see here, Quokka actually will output the result of this console log statement in the editor itself. This is a great way to learn and to show you a very, very simple example, just to drive it home, let's do something super duper easy. We'll do console. log two times two, and you can see immediately it goes four. So you can see exactly what's happening. Maybe if we use a division operator, we'll get one. And again, this just teaches you in the moment what your code is actually doing. A couple more extensions before we move on to some other tools. I really like ESLint, which is just this great extension that basically adds what's called linting to your JavaScript. It will basically change the colors. It'll highlight errors, things like that. And then we also have Prettier, which is a formatter that will basically just format your code with indentations and line breaks as needed. I love that. Okay, a few more tools beyond a VS code that I want to recommend here. First one is called DevUtils. This is a macOS app that basically just has a huge toolbox of little utilities that come in real handy when

### Segment 8 (35:00 - 40:00) [35:00]

you're programming. So for example, there's like a JSON validator and formatter. There's a text difference checker. There is like a regex tester, I believe. There's all kinds of really, really useful utilities that before I was using DevUtils, I would often have to Google for. So if you are in a Mac, check that out. If there is a Windows alternative, I will link to it in the description. I'm not aware of one right now. Another really useful one is called Recbin. This is just a website that allows you to send API requests or send a post or get requests to APIs. I use this all the time when I'm building pipe dream workflows. Just a really easy way to send those requests without needing like a special piece of software for it. So I recommend that. And then I also recommend, of course, GitHub. GitHub is probably something every programmer should get familiar with, or at least some kind of what's called version control system. So basically, I can write code on my computer. I can commit it to what's called a repository or repo. And here on GitHub, this is an example of a repo. I have my notion voice notes dot MJS file. It's a JavaScript file. Just put an M in front of it for, I believe it's module. And I can go into the history of this file. And for any given commit, I can literally see what was changed and what was added. So all of these lines here were added in this commit. These lines in red were deleted and replaced with these lines here. So if there's like a screw up or you're working with collaborators and they need to understand what has changed about a piece of code, that's what version control is really, really good for. And I would highly recommend learning at least a little bit about GitHub and how to use it if you are getting into programming. Okay, I want to share one more tool with you in this video. And it's actually a tool that you might find useful even outside of programming. So earlier I showed you my code snippets page inside of my Notion note taking database. And that notes page is inside a greater system that I built for myself called Ultimate Brain, which is an entire productivity system inside of Notion. A few years ago, I got really tired of juggling all kinds of productivity apps. I had a note taking app. I had a to do list app. I had another task management app for my team. And I eventually got to the point where I just wished everything could be in one place. And when I found Notion, I started to realize that I think I could build a system that would accomplish that goal inside of Notion. So I spent months tinkering, experimenting, learning how to use the tool. And eventually I was able to build a system where I have my tasks, my notes, my goal tracking, my project management, everything I need to organize my day-to-day life is now inside of Notion inside of a system I built called Ultimate Brain. And in particular, my favorite part of the system is the project manager that I built because for any given project, I can see both the tasks for that project and the notes for that project all on one page. And I find that super helpful because I'm often creating tasks as part of a project using the context from those notes. And in addition to just using this myself, I also released it as a product last year. And since then, over 25,000 people have bought it. And my team and I have collected dozens and dozens of testimonials from people who find it just as useful as I do. Now, you probably know if you've been watching this channel for quite a while that traditionally we've always relied on brand deals and sponsorships as our main source of income. And that's been great, but I have to say, being able to build something that is both useful for me and for my audience is even better, especially since we're not just selling a Notion template. We also include access to an active support community where you can not only get answers to every single question you have, but you can also swap tips with other people on how to improve your template, add additions to it, customize it, and improve your overall productivity system and your workflow. And if you haven't already picked up your own copy of Ultimate Brain, now is actually the best time to do it because we are running our first ever Black Friday sale. For the rest of this month, you can get Ultimate Brain at a huge discount, 50% off by going over to thomasjfrank. com/brain and using the code BlackFriday23 at checkout. Now, you might be asking yourself, why is Tom running a Black Friday deal? He's never done it before. It's a valid question. But in this instance, we actually have a very good reason for doing it. And that reason is we're actually building another tool that's going to make both Ultimate Brain even better, but also Notion better for anybody who uses it. That tool is called Flylighter, and it is going to be the ultimate web clipper and idea capture tool for Notion. It is a great tool that's going to help you capture screenshots, highlights, add annotations to those highlights. Basically, it is the idea and knowledge capture tool that I have always wanted. And the thing is, we want to build this sustainably. it in a bootstrapped way, and we don't want to take VC money. I actually already have VCs in my inbox asking about this, but I think that if we took VC money, we would eventually be forced or at least pressured into making decisions that weren't aligned with what you actually want. So instead, what I would love to do is be able to use the products we already sell as a way to self-fund the building of this new tool and allow us to have a great free tier in addition to the premium features that we're planning. So that is what Ultimate Brain allows us to do right now. And there's also a ton of synergy here because Ultimate Brain is already the best organizational and productivity system for Notion, and Flylighter is going to basically make the capture part of that system even better. So if you want to help us build this tool, you want to also supercharge your productivity and get the best organizational system for Notion, the best second brain for Notion, you can go over

### Segment 9 (40:00 - 41:00) [40:00]

to thomasjfrank. com/brain. And again, use that code BlackFriday23 at checkout to get 50% off of any edition of the template. You can pick up the standalone edition, or if you're a creator, you can also get the Ultimate Brain plus Creators Companion bundle. And that also gets you the exact system that my team and I use to manage all the content on this channel, on Thomas Frank Explains, on Twitter, on basically all the places where I put out content onto the internet. If you're a serious content creator and you want to put out more and better content, I think you're going to love Creators Companion as well. So once again, you can go over to thomasjfrank. com/brain and use that code BlackFriday23 at checkout to get 50% off of either edition of the template. And with that ad read over, because it's kind of an ad read, but it's my product, to wrap this video up, seriously, I want to say thank you because not only do I get to make this kind of content for a living, but now it's so cool. I get to make a literal startup for a living. And I feel like there's a way forward where we don't have to take VC money to literally build this really cool piece of tech. And that's all thanks to you. I've been putting out content for 10 years, but if you weren't watching it, then we wouldn't be able to do any of this. So seriously, if you've bought one of my products, if you've supported us on Nebula, if you have supported my sponsors, or even just watched this content and helped boost it in the algorithm, thank you. We would not be able to do this without you. Seriously, I appreciate you so much. To wrap this video up, because this is a coding focused video, I have a couple of different resources that I want to point you to. First and foremost, if you want a project that kind of just like takes everything I've covered in this video and shoves it into something you can actually do, my Notion API Pokedex project is something you might want to go through. It's a two hour video, and there's also a written version of it that links to literally all the resources I talked about in this video. Secondly, if you do want to learn to code, then learning how to learn more efficiently is going to help you in your journey. And that video right there will help you with that as well. Thanks as always for watching, and I will see you