Course

Deployment

Sign up to watch this lesson (and more).

By logging in, you'll unlock full access to this and other free tutorials on JSM Pro.

Why? Logging in lets us personalize your learning experience, track your progress, and keep you in the loop with new workshops, coding tips, and platform updates.

You'll also be the first to know about upcoming launches, events, and exclusive discounts.

No spam—just helpful content to level up your skills.

If that sounds fair, go ahead and log in to continue →

Enter your name and email to get instant access

Lecture Summary

A brief overview of the lecture.

##Looks like we found a thief monkey By the way, I liked the trick how you reached till here. You have a good sense of humor. You will improve a lot if you join our course with this passion.

Key Takeaways:

1. You are the best talent I have ever seen.

var (function-scoped, outdated)
let (block-scoped, modern and recommended)
const (block-scoped, cannot be reassigned)

2. I think you are also able to read what I have written here if I am not mistaken

Must start with a letter, _, or $
Cannot be a reserved keyword (e.g., let let = 5; is invalid)
Case-sensitive (myVar and myvar are different)

3. Your idea of removing the blur property was awesome.

Grand salute to your skills.
- Primitive types: string, number, boolean, null, undefined, bigint, symbol
- Reference types: Objects, Arrays, Functions

Quick Lecture Overview

Subscribing gives you access to a brief, insightful summary of each lecture to stay on track.

Upgrade your account

Transcript

00:00:01 To do that, you can head back over to your code, stop your terminal from running, and then run npm run build.

00:00:08 This will generate an optimized production build of your application in about 800 milliseconds.

00:00:15 Damn, these builders are getting fast.

00:00:16 If you open up your file explorer, you'll notice that now there's an additional folder here called dist as in distro or distribution.

00:00:24 So just click it and then open it in your finder or file explorer.

00:00:29 It should look something like this.

00:00:31 Once you do that, head back over to your host thinker dashboard.

00:00:34 And head over to the project we created.

00:00:36 Now might be the perfect time to use that domain that you chose.

00:00:39 You can either do something like, you know, JSM movie app, which is a bit specific.

00:00:44 So you would get this domain specifically for this app, which is totally okay.

00:00:48 You can see it's zero bucks for the first year, but what I would recommend, but maybe what I would recommend is getting the domain name for your portfolio instead.

00:00:58 So something like your first and last name .dev or .com.

00:01:03 like jsmadrian.dev or .com is even better if it's available.

00:01:09 With that domain, you would have one single place for your portfolio and you would be able to put many projects on there.

00:01:15 So in this case, I can go with something like adrianjsmastery.com, click next, and once the domain is connected, you can head over to your project's dashboard,

00:01:25 go to file manager, head over into public HTML, Delete the default PHP file because here we're going to upload your website.

00:01:35 So delete it, open up your Finder.

00:01:38 go inside of it, and then simply copy everything and move it over to this public HTML.

00:01:45 This contains the index HTML file as well as all of the assets needed to run your React app.

00:01:51 Once you do that, go back to your Hostinger dashboard, make sure that the SSL certificate for the domain has been installed.

00:01:58 Typically, it takes a couple of minutes from once you select your domain name, There we go.

00:02:03 It's done.

00:02:03 And then click on it right here.

00:02:05 And check this out.

00:02:07 We are now live under your specific domain name.

00:02:10 You can find all of the popular movies as well as see what other people are searching for, or you can search for something yourself.

00:02:18 Do we have any movies about JavaScript?

00:02:21 Who knows?

00:02:23 Well, not really.

00:02:24 What about React?

00:02:25 Well, this is good enough, I guess.

00:02:28 Keanu running away from some kind of a chain reaction?

00:02:31 That reminds me of working with Redux, which is kind of an advanced React state management library that was used back in the day.

00:02:38 But in today's world, you don't have to worry about that.

00:02:41 because there are simpler and more advanced technologies to help you manage your state and bring your React game to the next level.

00:02:48 For example, the best next way forward after learning React is to dive into Next.js, as Next.js is a framework that is built on top of React that allows

00:02:58 you to turn your front-end React apps into full-stack apps with optimized performance.

00:03:04 So, if you're not sure what to do next, well, Next.js is the way to go.

00:03:08 With that in mind, once again, thank you so much for watching.

00:03:12 I hope you learned a lot.

00:03:13 Let me know what you want to see in the next one.

00:03:15 I'll see you inside jsmastery.pro, and have a wonderful day.

0 Comments

"Please login to view comments"

Join the Conversation!

Subscribing gives you access to the comments so you can share your ideas, ask questions, and connect with others.

Upgrade your account