What to Expect in CodePath’s Web Development Pathway

Hi everyone. I am super excited to share with you all information about CodePath’s web development pathway. My name is Karen and I am the curriculum developer for our web courses.

So, I’d love to give you all some insight and a sneak peek of what these courses look like. So, overall, our web development pathway covers full stack development. Our goal is to make sure you all develop the skill set you need to design and create unique different types of websites and to thrive as a web developer in the industry, whether you work on front-end development, back-end, or full stack development.

We do that with three courses. We have the introductory course, the intermediate course, and advanced course, all covering those important elements in web development. So, to dive into what each of those three courses entail, I’m taking you all to our course portal, which hosts all of the different course materials that you’ll use throughout the course run of each course.

So, in starting off with web 101, this course covers the fundamentals of front-end development. In the first few units, you’ll explore how to structure the interface of a website, how to structure it so that everything you want to include on a website is there and it looks aesthetically pleasing. So, you’ll see we’ll do that that in the first four weeks using HTML and CSS.

Then, we’ll dive into JavaScript, allowing our websites to have more functionality and to be more interactive. So, for example for example, this is an example of a one-page website that has different features that you can interact with. So, it has a navigation bar that you can click on.

It allows you to toggle between light and dark mode, and it also has a form that you can actually fill out. So, through HTML, CSS, and JavaScript, you can create a one-page website like this, which you will be doing, with your through-course project. So, throughout the 10 weeks of the course, you’ll be learning different concepts and each week adding on to your project.

So you’ll get to add that navigation bar that we saw, that form that we saw. And then in the last week of the course, you get to show off your one-page website, showcasing all that you learned in Web 101 so far. Then, navigating to our Web 102 course, in this course, we get to take our websites to the next level and add even more interactivity and functionality.

So, we add more interactivity using React, which is a JavaScript library. So, here now, instead of creating one-page websites like we did in Web 101, we’ll get to create multiple-page websites. So, for example, in unit seven, we’re going to be creating this project called Crewmates, and you can base it off of anything that you want, but this is an example where, you have a separate page to create a new crewmate, you can add in your user input, and then you have another separate page displaying, all the crewmates that were added so far.

So, this is an example of a multi-page website. Another thing that you’ll learn in Web 102 is how to respond to complex user input. So, in this week’s lab, you’re going to be creating On My Grind, which is a game based off of Wordle, and basically, it’ll test your users on, guessing the ingredients of this drink.

So, if I want to make a salted caramel Frappuccino, what are the different ingredients needed in that recipe? And basically, you can check your answer, and this is an example of getting different types of user input. Then, towards the latter weeks of the course, we’re going to dive into databases.

And we’re actually going to connect our websites to real-world data. So, here in this week’s project, we’re going to be querying an API that allows us to showcase different types of cats, which is definitely super exciting and unique. And in the course, you’ll get to choose an API of your own.

You’ll get to showcase your own interest, and yeah, really let your creativity shine. But, this is one example, here you get to again discover different things, and input different types of data. And now that we’re getting into databases and what’s going on behind the scenes, it’s time to learn about back-end development, which is what our Web 103 course covers.

So, in this last course of the web development pathway, we switch our focus into databases, and the server side of a website using Node, Express, and Postgres. So, in the first four units, you’ll focus more on how to build a back-end that connects to your website, and then you’ll get to manage the data and structuring data. So, On the Fly is an example of a lab that you’ll be working on in the first four weeks.

And so, it’s basically a trip planner. It has different suggestions for trips, destinations, and you can even add your own suggestions for a trip. And so, this is an example of a website that has a lot of different types of data, a lot of data relationships.

So, yeah, so this is going to have a complex database on the back end. Another really fun feature about this website is that it has authentication. Nowadays, you really want to create a unique user experience for your users, and that really means them being able to log in, update their own data, not someone else’s data, and we do that with authentication.

So, in this web app, you can log out, and then you can log in. By the end of the course, and end of the pathway really, you will have built a full-stack web app like this web app here, from scratch, on your own. So, this is an example of a final project that showcases almost everything that we’ve learned throughout the three web courses.

It has an aesthetic interface that allows user interaction. It allows you to update your data. So, for example, if I have 245 coins here, and I need a nice latte, I can spend 90 coins, and you can see visually that my coins update, and you can tell that it updates in the back end also, because if we log out and log in, I will still only have 155 coins left.

For all three courses, you’ll have an in-class activity and or lab, and it usually comes in the second half of a class session. In the first half of the class session, you’ll have the lecture portion of the class. And so, this is an example lab deck that we have and the lecture portion usually has interactive elements like an instructor demo or it has parts where you can share out and have it has different discussion as well.

And so, most classes or all of our class sessions are 2 hours and in web 102 and web 103, you’ll actually have projects to work on outside of class because we want to make sure that you get as much practice as possible to really grasp the concepts that we’re learning and really have time to add those features onto your own web app. So, hopefully you could tell by this video that our courses are very hands-on. We love giving you all the opportunity to get that hands-on experience and to let your creativity shine through all the different labs and projects.

That being said, when you apply to CodePath, our web courses in specific will have a pre-work assignment for you to add to your application. But really, this is so that we could make sure we place you in the right course in the pathway and to determine if the course that you’re applying for is right for you. In web 101, it’s not a technical task.

It’s just a quick ideation assignment where you’ll create a wireframe for a website idea that you have. And in web 102 and web 103, the pre-work is definitely more technical, but this is because it is for the intermediate and advanced track. Overall, I want to say when we were designing these pre-work assignments, we weren’t designing them to really try and test or trick you.

So make sure you reach out on the pre-work support channels on Slack. We’ll have people there to guide you and answer any questions you have. You’ll also be with all of your peers there and so, definitely use it as an opportunity to collaborate with each other.

Web development is a collaborative process with each website takes a whole team of people to create, and so definitely reach out and collaborate with each other, and yeah, join join the pre-work support channels and ask any questions that you have. So that is it for me. I’m really hoping to see you all in the fall, and good luck with everything and the pre-work.

Thank you all.