Starting your coding projects is the hardest part (Do this first)

I remember when I first got out of bootcamp, I thought I was the shit. I thought I was job ready, but as soon as I didn't have my instructors help, I was kind of screwed. The thing that I was most lost on was if I have an idea and I want to create a simple app, how the heck am I going to do it? And my name is Phil. I became a senior developer quickly from a guy with no CS degree and at the age of 30. In this video, I'll tell you exactly how you should start every single project, whether you are a solo developer or working with a team. So step one, you know, if you have an idea and you have a project, you should really put it down on paper, what you want to build. So just get some pen and paper. So let's say like you want to start an Instagram phone or something, right? I cannot find a pen right now. One second, I'll be right back. Let me get a pen. So I got a pen. It honestly doesn't need to like be like too in depth or anything, but just put it down on paper. I know this is like really bad handwriting, but there you go. I just wrote it down. That's just an example, but just a couple sentences of what your app wants to do and just get it down on paper. So it's in your head and you want to do it. So that is the first step. It's just a description of what you're going to be doing and how you want to achieve it and the things you need to get done. Like for example, let's say an email generator app. And if you want to see how to set up that project, I'll link below the video. Because what we did there is exactly how to start my project. No matter how complex or how simple it is, it's just about putting it down on paper or typing it on Google Docs and kind of getting that started. So I'm just going to bring up like an Instagram clone that I did a while back. So I put it down on paper and then it started. Read me right? And so I'll share my screen here. If you found this video useful, please share it with your friends. Like comment share really helps the algorithm to help other people find this channel and gain value as well. There you go. So this is basically like a readme. It'll be a mobile app. So this is how we develop it. I'll make it a little bit bigger. There you go. So this is an application that will be used for social networking. It is Very similar to Instagram. So the application will be built using React Native and Firebase React Native for the front end. And I'd like to say what I'm going to use like React Navigation for navigation, Redux for state management as I did this a long time ago. React Redux for Redux Bandings, Redux Thunk for Async Actions and Firebase for the backend Firestore for the database, Storage for the images, Authentication for the users. So authentication for the users functions for the serverless functions and messaging for the notification. So you make a checkbox like list. The features will include authentication, profile posts, comments, Likes follows, messages, notifications, settings, search and explore. So you would just have a checklist and then check those off as you go or you'd move this stuff into Trello and it'll help you make your Trello more readable and it'll help you on that journey, which we'll get into next. So then you put like maybe your app folder structure with your assets, your components and however you're going to build up this project. So your readme is always the first thing that people are going to see if you ask for help on your code. So it's just being considerate of other people and really just being considerate to yourself. Whenever I tell people to write a readme I always tell them it's more for yourself than anyone else. Just like your GitHub commit messages, they're more for you than anybody else, but other people will see them. It's just being considerate like and save time as much as possible. Maybe some things on how you're going to init the project and then the packages used. So I used Babel Plugin module resolver to help my pathing and it's how I installed it and I set it up. I added some packages like Clean Project, Rename Project, how to like change my app icon, my splash screen and just all the packages like it's my style. People say it's redundant. People say you don't need to because you have the Internet. But I just like to think if I didn't have the Internet and I wanted to set up this project, could I do it with this document? And I would say, you know, maybe you can, but I guess you cannot install NPM packages without the Internet anyways. But having it all in one place, it's good for me because if I want to do another project, I can always go to this readme and be like, okay, that's like, that's something cool. I did and Installing things is a pain in the ass. So just a readme would be cool. Basically, you know, a title, couple sentences, a description of the project packages used in, documentation of how to install it, and then with the links as well. And this was back in the day, so I didn't really put the links here. But I will show you how to do that in your readme. So let's say react native vector icons. I put, put the link here. I would probably just put a square bracket and put the link after the header and do it for all of them. That's just how you do it right there. So cool. That's exactly what I do for my readme. And then after I have like an idea of how to set up the project, what it's going to need, we're going to need is like a draw dot IO. So I'll bring that up right now. Let's see. I brought a draw IO. I would make it a simple example of like authentication flow and you guys can see what I'm doing. So I'd put up like maybe I'd say this is like a screen. I'd say this is initial screen. I'll make this a little bigger. So you see initial screen. And then from the initial screen people can probably log in or go to like sign up like form from here. And then if they log in with like Google authentication, it's probably just going to stay here. So and then from here they can go to the sign up form obviously. So I just take that out. They can log in here and then from there they can either go, they can go to the sign up screen and that's cool. And I'm sure they could go back, so that's cool. And then after they sign up you probably go to a home screen, right? Like after you log in or sign up, it's. You're probably expecting some kind of home screen. I did this kind of thing. All right, there you go. And from the home screen, what can you do? Right? Let's just think very basically on Instagram you have home, you have the home screen. Then you have like the Explorer screen, then you have. Take a look. Let me just bring up my phone real quick. Here we are. Oh, you have like the home screen, you have the search screen, you have the upload screen, you have the short screen and your profile screen. So explore and search screen. So the search screen and then you have the explore screen and you have an upload screen. And it's not like too much documentation, it's just like how your App will kind of flow and what kind of things there would be. So you have an upload screen from home screen, you have a search and export screen, you have an upload screen. Then you have your short screen. Recently, I guess. So you have a shorts screen or. No, no, I think it's called reels on Instagram. Sorry, I don't actually know. Short form content screen. All right, that's content screen. And you have your profile screen. And then you just kind of say, hey, from the home screen you can go here and I'm sure you can go everywhere from here, but just put it down on like some drawing, just like to get it in, into your head. And then from there you can kind of say, okay, what kind of screens is the profile screen? I'm sure the profile screen, you're going to have an edit profile screen, edit profile, you're gonna have some kind of settings screen and, and so on. And I'm not gonna do it all because it. It's gonna get crazy because Instagram has like over, like, I don't know, 50 to 100, maybe 250 screens or something. But basically you just make some kind of flow and you kind of see exactly what you need to do here. So that's the next step. So I'd make the readme. You know, from the Readme, I'd have some kind of idea of what I want to build. And then from what I want to build, I'd make the flowchart with Draw IO or whatever flowchart maker you want to make. And then from there set up some kind of, like, trello or any kind of Kanban board, like Jira Notion or GitHub projects, and make some, you know, issues, make some tickets, you know, or make some tasks so I can start knocking them out. Because if I start thinking like, hey, I'm just going to build Instagram, it's going to be a very big mountain to climb. But if I think about, like, okay, I want to make the background color white. Okay, I want to make another task. Like, I need to make email input and email validation for the input. Then it's just like these little mountains you have to climb and you get like little hits, dopamine, whenever you finish those tasks. So I'll show you like, an example of a trello that I created for the Instagram clone a long time ago. Let me bring that up. So here we are. Basically, from the readme, you have your context of the app. Then you have from your Draw IO or whatever flowchart maker, you choose you have like your flow of how you're going to do things and then from there you can make your app skeleton right. The types of tasks in your app. I have authentication, app home features, settings, profile, firebase, notifications, user interface, and basically I just put all my like readme kind of stuff in here, like what the app will do if I have any resources, like communication channels, if I have a team, I put it all here. And you could put bugs and then you make an app backlog what you're doing at the moment, the done things. Then you break up the sprint. If you're going to be working in some kind of agile thing, but basically you have your sprint one, your sprint two and your sprint three. I usually make them 10 days. Seems like it was one month on this project, but 10 days is a good thing for like or Sprint. So basically you have to kind of make these tickets or whatever and you have to say how long it's going to take you, what the difficulty level is. And basically difficulty level equates to time and make it so that everyone can understand. And if you ask anyone to help you, they can start taking these tasks and helping you finish. So that's basically some kind of way you can set up your project. You know, in the Trello you'll really have to break tasks down into small tasks. You know, make the sections like to do, doing and done and put the skeleton of your app so like the different parts of your app so you can label what kind of tasks they are. So that's how I would get started. And then, you know, then you get to the fun part which is getting to code the thing man, so steps, you know, ideation, so putting it down on paper or a Google Docs, then initializing your project and making a readme and putting in there exactly how you can initialize the project, how you can run, run the project packages used, description of the project and all this kind of stuff. And then from the readme you'll have some context of the app you're going to create. From there you can make a draw IO, some kind of flowchart. Then you can start breaking it down and you can kind of visualize how the app's going to be. You can make like little tasks and it'll help you. And I use Trello not just for development, I use it for other kind of work. Let fill stuff, let fill tasks or like anything. Like I used to use it because I used to do business phone calls, communication for like, for this company. They used to have a lot of foreign clients. So I used to have to like take make a lot of phone calls, emails and it was just a good way for me to organize my work and you know, put things into to do doing and done. And you know my goal of the day is to just like move everything to done. It's really hard but it gets done over a period of time. From there get started Coding and you know the two hardest things in programming other than naming variables is starting a project and finishing a project. The most important thing is starting a project. This will separate you from the pack from the other developers. It will help you become a valuable team member of the company. Creating good habits from the start is how you get good. If you want to see me build projects from scratch, live and help you as a developer get to the next level, please join the discord and join my free JavaScript course. And if I can do it, you can do it. Coding saves lives if you found this video useful, please share it with your friends. Like comment share really helps the algorithm to help other people find this channel and gain value as well. If you found this video useful, please share it with your friends. Like comment share it really helps the algorithm to help other people find this channel and gain value as well.