Become A Web Developer - Part 13: Developer Environment | Andrei Neagoie | Skillshare

Become A Web Developer - Part 13: Developer Environment

Andrei Neagoie, Senior Software Developer + Instructor

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
2 Lessons (16m)
    • 1. Sublime Text

      9:29
    • 2. Terminal

      6:36

About This Class

Developer Environment

This is the tutorial you've been looking for to become a web developer in 2018. It doesn’t just cover a small portion of the industry. In this multipart video series we will covers everything you need to know to get hired: from absolute zero knowledge to being able to put things on your resume that will allow you to live the life you want. 

Sounds too good to be true? Give me 5 minutes of your time to explain to you why I built this course and what is different here than thousands of other courses all over the internet.

  1. There is no wasted time here. We won’t be using outdated technologies like PHP, Wordpress and JQuery. Although still useful, outdated technologies like the above are low paying and demands for them are decreasing. In this course, you will learn the specific technologies that are the most in demand in the industry right now. These include tools and technologies used by the biggest tech companies like Google, Facebook, Instagram, etc… It’s geared specifically for people that want to learn employable skills in 2018.

  2. After finishing this course, you will be able to apply for developer roles, or upgrade your job title as a developer and earn a higher salary. We won't be taking any shortcuts in this course. I am going to take your from absolute zero, where I teach you how the internet works, to mastery, where I show you how to build an image recognition app using a Machine Learning API (a subset of Artificial Intelligence).

  3. This course is taught by an instructor who has worked in silicon valley, and one of the top tech companies in Toronto. I have built large scale applications, and have managed a team of developers. I have worked directly with these technologies. I am not an online marketer or a salesman. I am a senior software developer who loves programming and believes that there needs to be a course out there that actually teaches valuable skills.

  4. I know your time is valuable. You want a course that outlines the best way to learn the topic in simple, well explained methods so that you fully understand topics instead of watching somebody on your screen and having no clue what is going on. I have created this course after consuming hundreds of books, tutorials, and online courses while I was learning. I have taken the best pieces, the best methods, that I have found, and condensed everything so that you can learn in the most efficient way possible. 50 hours of videos doesn't mean much if the instructor isn't engaging or focuses on outdated topics. 

  5. We have a thriving online chat community so you really feel like you are part of a classroom and not just watching videos by yourself. You will have a chance to communicate with fellow students, work on group projects together, and contribute to open source. Anytime you have a question you can ask in the chat and someone will surely be able to help you right away. 
  6. The course is designed to give you employable skills so you can get a job. Here is what one student recently wrote after taking the course and being hired right away: 
    "I’m a self taught dev, who has been out of work for ~6 months. I had some family things that came up that prevented me from seeking permanent employment, so for awhile I was Postmates/Uber delivery driver.
    After taking this course, I immediately got catapulted back to where I was before, but better equipped and with the knowledge to take on the next job. I had just finished the React section when I went to a recent interview, and it really helped me excel. As of today, I am officially re-employed back in the field, and it is all thanks to this course. I had a blast creating the final project, and FINALLY got around to learning SQL statements, and getting to use them in a project. I’m really ecstatic that Andrei went with teaching relational databases over something like MongoDB, which can also be fun, but is less practical for use on the job. So thanks Andrei , I really enjoyed the course and will be making sure to share it with others who find it helpful. I’m also looking forward to the new ES7/8 content that was recently added, and going through the DB stuff again when I go to build a personal project."

In this course, you will be taken through online videos and exercises where you will be able to do the following things by the end:

  • Build real complex applications and websites
  • Build an image recognition app together at the end of the course so you can add it to your portfolio
  • Go into a job interview confident that you understand the fundamental building blocks of web development and the developer space in 2018
  • Be able to go off on your own and grow your skills as a developer having built a solid foundation
  • Learn how front-end, servers, and databases communicate and how they all fit together in the eco system
  • Build your own startup landing page. 
  • Go off and remotely work by being a freelance developer and bid on projects.
  • Know EXACLTY what a day in the life of a developer is like and what the day to day technologies and tools will be that you are using. 

By the end of this course you will be comfortable using the below skills and you will be able to put them on your resume:

  • HTML5
  • CSS
  • Bootstrap 4
  • Javascript (ES6/ES7/ES8)
  • React + Redux
  • Git + Github
  • Node.js
  • Express.js
  • NPM
  • PostgresSQL
  • SQL

This course is the accumulation of all of my years working, learning, and teaching coding and all of the frustrations and incomplete information I have encountered along the way. There is so much information out there, so many opinions, and so many ways of doing things, that unless you have spent the last years working with these technologies in a company, you will never fully understand. So this course is the answer to that exact problem. I have gone through thousands of coding books and online tutorials and bootcamps. I have worked with these tools on real applications. Throughout the years I have taken notes on what has worked, and what hasn't and I've created this course to narrow down the best way to learn and the most relevant information. 

I will succeed if you succeed in this course. Therefore, I will be there every step of the way helping you understand concepts and answer any questions you have.

I am 100% confident that you won't find a course like this out there that is as well organized, and as useful, to build a strong foundation for you to start a new career. We're not going to be building simple todo applications and cat image sliders. We are going to learn actual practical skills that will put you into the workforce. Some unique sections that you won't find anywhere else are:

  • React.js + Redux: you will learn the library that companies like Netflix, Facebook and Instagram use to build fast, scalable applications. This is one of the highest in-demand skill in the industry.
  • A day in the life of a developer: What will your day to day look like and what tools will you use? I will take you through a sample day at a tech company.
  • How does the internet actually work. What is the history of these technologies: I will actually have you understand the underlying concepts of the internet, and how the technologies we have now, have come to be where they are.
  • How do you actually deploy a real life app so that it is secure, and won't get hacked: How does a real life app get out to the public?
  • What is Machine learning and how you can harness it's power: Whether you have heard about it or not, this is something that you will hear more and more in the coming years. Those who understand the high level concepts and can harness it will have an advantage. 
  • What is your developer environment on your computer look like: We will be setting up our computers with all the tools necessary of a developer so you can use the same setup when you go into the workforce.

Why do we teach the above? Because in this day and age, just knowing HTML CSS and Javascript is not good enough and you won't be able to grow in your role and command a higher salary. I am teaching you these things because these are the things you should know in 2018 so that you are miles ahead of the rest. 

Make this the year that you took a risk, you learned highly in demand skills, you had new experiences, and you received new opportunities. I hope you join me in this journey. 

This is the proudest work I have ever done in my life and I am confident that you won't find a course better than this. 

See you inside!

Taught by: 

Andrei is the instructor of the highest rated Web Development course on many platforms. His graduates have moved on to work for some of the biggest tech companies around the world like Apple. He has been working as a senior software developer in Silicon Valley and Toronto for many years, and is now taking all that he has learned, to teach programming skills and to help you discover the amazing career opportunities that being a developer allows in life. 

Having been a self taught programmer, he understands that there is an overwhelming number of online courses, tutorials and books that are overly verbose and inadequate at teaching proper skills. Most people feel paralyzed and don't know where to start when learning a complex subject matter, or even worse, most people don't have $20,000 to spend on a coding bootcamp. Programming skills should be affordable and open to all. An education material should teach real life skills that are current and they should not waste a student's valuable time.  Having learned important lessons from working for Fortune 500 companies, tech startups, to even founding his own business, he is now dedicating 100% of his time to teaching others valuable software development skills in order to take control of their life and work in an exciting industry with infinite possibilities. 

Andrei promises you that there are no other courses out there as comprehensive and as well explained. He believes that in order to learn anything of value, you need to start with the foundation and develop the roots of the tree. Only from there will you be able to learn concepts and specific skills(leaves) that connect to the foundation. Learning becomes exponential when structured in this way. 

Taking his experience in educational psychology and coding, Andrei's courses will take you on an understanding of complex subjects that you never thought would be possible.  

See you inside the course! 

Transcripts

1. Sublime Text: as a developer, a developer environment is really important. Since you'll be spending a lot of time in front of the computer, you want to make sure everything is set up properly in this video. We're going to go over how to set up your developer environment, and I'll show you what I use on my laptop now. Since I'm using a Mac, I will leave notes after this video for Windows users as well. Finally, this video is completely optional, and actually this entire section is optional. If you are looking to customize your set up or you already have it done, then you can skip over this section and move onto the next one. Now let's get started in this video, we're gonna customize sublime text. Mean sublime text looks pretty nice, and I have a sample project. Actually, our background generator here, you know, it's it's kind of played and boring. I want to show you that if you go to sublime text to preferences, you can actually choose some color schemes and themes. So theme, for example, you see that we only have two right now. I can change it to that. I can change the color scheme to this and we got a bit of a change. But the one that I really, really like is material theme. And I'll leave the link to this for you. And you can see over here that it makes your sublime text look really, really nice. If I go over this, we see that we can just install it with something called Package Control. And the way we do that and they actually gives you pretty nice instructions. Is Mutiny do press command or in case the Windows Control and P. So let's do that. I'm going to say command shift P and I see over here install packages so I can actually start typing and I'll get installed packages. Or if you don't have package control, you can actually install package control through here as well. So let's install packages and let's see what it says over here and enter search for material fee. OK, so we'll just say material theme and there it is. I'm gonna click on it. You'll see that down here is doing a bit of work to download it. And once it's done installing, we should have. There you go. We've installed it and says to activate the theme Well, it actually gives you a really nice instructions again. It's actually a really good idea to close and reopen sublime text. It's just to make sure everything is running smoothly. So I'm gonna close and let's just reopen it. And all we have to do now is just go to preferences theme and look at that. We have our material theme. So I like the You know what? I like the darker one. So we'll do. I Let's do the default one. There you go. Okay, we're getting there. Let's check out what else it says we're here. So we've changed it to material theme. And if you go to color schemes as well now you have material theme as well, so we'll make sure that those match I'll say material theme. Look at that. It looks pretty nice. So we have our script file looking nicely and also our CSS looking nice. Okay, awesome. Let's see what else we can do with this steam. Other thing is, you have a couple of add ons. You can actually add file icons if you want. You can see over here that you can add these. Let's see how we can install this. We can just do package control installed package and find a file icon. So let's do that. I'm gonna again do command shift B installed package and let's do file if I like on There you go. Please restore sublime text for the applied icon stick effect. But it looks like it already has. Look at that. You can see over here I have the issue mollify via Gone, the JavaScript icon and the CSS three icon. That looks pretty cool. Awesome. I'm gonna close that. Let's go back to your cereal theme and they have recommended settings for a better experience. I'm actually just gonna copy this where you want to put this. Well, if you go into sublime text preferences and you go into settings, you'll get default settings on the left hand side and on the right hand side, you have the user settings and you want to make most of your changes on this site. You see that our theme has already been automatically changed to material. So here we can just add our copy and pasted suggested theme options. Let's say that some of the themes have changed. Awesome. I'm gonna close this and all right things. They're looking a little bit nicer. What else? Give me do here. You can actually also change the funds by Donald. Something like Roboto mono, which is a Google Funt. If you remember, we just have to click the plus icon. We'll download it And once we open that, there you go. We have our font and what you do is you actually grab this and drag it into your application, which is usually even on windows. You'll have a font up on Mac. We have the Funt book right here, and all we do is just drag it in here. So I have Roboto mono now as my font and it's actually very easy to change If I go into my settings again and we can just say font face and we'll do roboto mono If we save that. There you go. We've changed Our font looks even nicer And one last thing that I really like doing is changing the color scheme. There's something cold oceanic next, that's really, really nice. And as you can see, this is completely up to you. If you wanna have your own little color scheme and theme. You can do that yourself. But again, I just want to show you my set up here. So package control Oceanic. Next again, we just simply do command shift be installed. Package oceanic Next color scheme. Press enter. And now if I go to sublime text preferences color scheme, I should have oceanic next. And there you go. I personally like this color style, if you like something else. Well, that works too very cool. And the last thing I want to show you is that besides, just look seeking and stole packages with sublime. And if you just go to sublime packages, you can do a lot of things. You can add a lot of extensions to sublime tax and anything that you need for us. I think the most important thing is that again we do install package, and the 1st 1 is called Babel. And as you see, it's a syntax definitions for es six javascript with reactionary sex extensions. Who? What does that mean? Well again, as new features of javascript come up, we want to make sure that sublime text recognizes it, and as older colors and formatting that we need well by having Babel and we install this. We now have a Babel file format. So if I actually click on this instead of the JavaScript one, you can do some really nice things like error functions. And it will recognize. I recommend using the JavaScript Babel version to make sure that any new JavaScript features that you use. It will be nicely highlighted. One other one, actually, that I'll show you is the sidebar I got installed package and then sidebar enhancements. Up until now, if I right click here, I have only a few options. Rename, Delete five or reveal and find her. If I add sidebar enhancements and now I go right click. I have way more options that I could do with my files, which is very, very cool. All right, that's it. Play around with your settings and you can read up Aton on the Internet about everybody's customized way of doing things. I think picks works really, really well. It looks pretty, and it makes your life a whole lot easier when writing new JavaScript syntax. I'll see in the next one. No, my 2. Terminal: in this video, we're going to set up our terminal toe look nice longer newly set up sublime text. As you know, the terminal is just they text based way to communicate with the computer instead of the graphical user interface that we normally use as developers. You will spend a lot of time with the terminal, especially as you become more and more senior in your role. So let's make it better if we open up the terminal. I have it open already for myself. You see that we have the word Basheer Bash is a type of shell that a terminal can half and what I mean by that? Well, Justus, the name suggests it's just the casing around the terminal that is customizable. There's actually more than one shell bash is just one of them one. My favorites are Oh my Z S H. There's the fish show and they all have different things that you can do with them. But it's just another way to customize your workstation. Before I get into that, let's just customize our bash. The way we do that is we can first start off with getting something other than just having this to the left. The way we do that is we type in Nano, which is a text editor, and then we do squiggly line slash dod bash, underscore profile. And here what we opened is a file that is the bash profile says this is what our profile will look like. This file gets read every time we open up the terminal in here, we can put in a bunch of things that we want our terminal to do. One of the cool things that I really think is fun is updating your PS one variable and all linked to this website. And there's a bunch of examples here that we can use. Let's just pick one that, like this one over here, all we do is copy and paste this. And within our bash profile, we can just copy and paste. And as you can see, RPS one now equals a whole bunch of gibberish that we don't really need to worry about. We see over here that to accept we need to do control X, then save modify. We just press why and then press enter. Okay, nothing happens. But the way we fix that is we now do source and then bash profile it. Essentially reloads are profile now and look at that. We now have a cool little prompt to the left so you can set up your PS. Want to display whatever you want? If you want to your current directory to display, that's great. If you want you using name to display, that's good as well. You can set up in a ton of voice the other thing that the terminal lets you do. If you click on something like edit background color, you'll get a few things that you can change in your shell. You can change your color based on what you want, and if I bring this over here, you can also click on the profile. And actually, it gives you a bunch of pre built ones that look really cool. The soup pro actually marinas again. You can customize this as well, and as I mentioned, a different operating system. You have your own ways to customize it, but every single one usually has a profile and a way to modify what gets displayed based on your needs. Now the one that I really, really like is a shell that's different than Bash, and I've used this one before, which is really, really good. It has a ton of themes that you can use. They have a bunch of options and you can play through them. The one that I really like is the fish shell. It's very simple, has all the operating systems on it, and I install it. Using homebrew for those on a Mac homebrew is a way to install anything from the Web. So instead of me going to a website and installing something, I can use the command line to download things. If you go to the home brew website brew dot shukan, actually, just copy this link into your terminal copy and pasted press enter and it will install homebrew for you. I already have this installed, so I'll just accept that the way install fish you can see over here all I have to do, say brew, install fish. And while this is happening, I want to show you another option so we have the terminal over here. But I term, which again is specific, for Mac is really, really nice. And it's way more customizable than the terminal, so I prefer using. I term, too. If I open this and double click and look at that, this looks way nicer already, so let's just compare them side by side. I have my let's make that a little bit bigger. I have the bash shell here and I have the fish shell here. Although they both are in the desktop right now, they're running on different shells. The fish shell has just like we have with the bash. Profile has its own profile, so you can set it up and you can set up which one gets activated when you first open up the terminal or writer. What I recommend is to set up your workstation in a way that's nice to you. My preferred way is to use I term and the Fichaud, but if you want to use bash, that's great. The beauty here is that if I type in bash, I get taken to the bash profile, and if I got bin fish, I get back to fish. I term also lets you just customize everything really nicely. If I goto preferences, you'll see here that I have appearance profiles where we can have colors set up and there's a Thanh more you can do with your terminal that I won't get into into this video because everybody has their own way of doing things. I just wanted to show you a basic set up so that now you have a nice environment that you can work it. I'll see in the next one. But why?