TubeSum ← Transcribe a video

سر جوجل الجديد | انشاء موقع الكتروني او تطبيق باستخدام جوجل !

0h 16m video Published Jan 27, 2026 Transcribed Aug 3, 2026 A Ayman safwat - علامة استفهام
Beginner 8 min read For: Beginners and non-programmers interested in creating websites or apps without coding, and those looking to deploy them on hosting.
AI Trust Score 65/100
⚠️ Average / Some Fluff

"Delivers on the promise of no-code website creation, but includes a lengthy hosting sales pitch that dilutes the core content."

AI Summary

This video demonstrates how to create fully functional websites and applications in under 10 minutes without writing any code, using Google's AI-powered tool, Google Studio (likely referring to Google's AI Studio or similar). The presenter showcases two examples: a content creator assistant and a cooking recipe app, then walks through the process of building, customizing, and deploying a website to hosting, with a focus on using Hostinger for professional deployment.

[00:02]
Introduction: No-code website creation

The video claims that websites and tools can be created in less than 10 minutes without writing a single line of code or having programming experience, using Google Studio.

[00:31]
Example: Content creator assistant

A site for content creators that discovers trends, analyzes content, optimizes video SEO, and writes scripts. It uses Google Trends and YouTube data to suggest topics based on search volume.

[02:27]
Example: Cooking recipe app

An app where users list ingredients (or upload a photo) and specify dietary preferences and budget, and it generates recipes based on those inputs.

[03:32]
How to build: Using Google Studio

Go to Google Studio, describe your idea in simple language, and click 'Start'. The tool builds the website code automatically, and you can preview the result.

[04:34]
Customization via chat

You can modify the website by chatting with the tool: change names, add exercises, change colors, etc. There's also a 'Restore' option to undo changes.

[06:15]
Sharing and publishing

Use 'Share' to publish and get a link to share with others, who can view and modify the site. You can also download the site files for professional deployment.

[07:10]
Deployment: Download and extract files

Download the site files as a compressed folder, extract them, and rename the folder to English for compatibility.

[07:55]
Using Node.js to build files

Install Node.js, then run 'npm install' and a build command in the folder to generate the final 'index' file needed for hosting.

[10:34]
Uploading to Hostinger

Log into Hostinger, add a site with PHP/HTML, go to File Manager, delete default files, and upload the built files to 'public_html'.

[12:22]
Hostinger plans and pricing

Hostinger offers hosting from $49/month (single site), but recommends Premium ($3.29/month for 48 months) or Business plans for more websites. A discount code is provided.

The video provides a practical, step-by-step guide to creating and deploying no-code websites using Google Studio, with a strong emphasis on using Hostinger for hosting. It demonstrates that anyone can build functional web applications quickly, even without technical skills.

Mentioned in this Video

Tutorial Checklist

1 03:32 Go to Google Studio and describe your website idea in simple language, then click 'Start'.
2 04:34 Customize the generated website using the chat: change text, add features, or modify design.
3 06:15 Use 'Share' to publish and get a link, or download the site files for deployment.
4 07:10 Extract the downloaded compressed files and rename the folder to English.
5 07:55 Install Node.js, then open the folder in Command Prompt and run 'npm install'.
6 10:09 Run the build command to generate the 'index' file.
7 10:34 Log into Hostinger, add a PHP/HTML site, and go to File Manager.
8 11:20 Delete default files in 'public_html' and upload the built files.

Study Flashcards (7)

What tool is used to create websites without code?

easy Click to reveal answer

Google Studio

03:32

What is the first step to create a website in Google Studio?

easy Click to reveal answer

Describe your idea in simple language and click 'Start'.

03:32

How can you customize the website after it's generated?

medium Click to reveal answer

By using the chat to give instructions like changing names or adding features.

04:34

What command is run in the folder to install dependencies?

medium Click to reveal answer

npm install

09:41

What is the purpose of running the build command in Node.js?

medium Click to reveal answer

To generate the final 'index' file needed for hosting.

10:09

Which hosting provider is recommended in the video?

easy Click to reveal answer

Hostinger

10:34

What is the minimum cost per month for Hostinger's Business plan over 48 months?

medium Click to reveal answer

$3.29 per month

13:06

💡 Key Takeaways

💡

No-code creation in under 10 minutes

Sets the core promise of the video: anyone can build websites without programming.

00:02
🔧

Google Studio builds from description

Demonstrates the simplicity of the tool: just describe your idea and it generates the site.

03:32
🔧

Chat-based customization

Shows how users can modify the site interactively without code.

04:34
📊

Node.js for building files

Explains the technical step needed to prepare files for hosting.

07:55
📊

Hostinger pricing and plans

Provides concrete pricing details and a discount code, useful for budget-conscious users.

12:22

[00:02] your specialization, this video will benefit you in ways you can't imagine. The websites and tools you see in imagine. The websites and tools you see in front of you were made entirely in less than 10 front of you were made entirely in less than 10 minutes without writing a single line of code and without any

[00:16] minutes without writing a single line of code and without any programming experience. Whatever your field, you can create an programming experience. Whatever your field, you can create an application, website, or tool in a few minutes using Google iStudio. The topic, guys, is fantastic, almost like magic. And by the way, it could be the

[00:31] beginning of an online project that you create, it could be the beginning of an application, website, or program that you create and benefit from financially. You will see now that the topic is easier than you imagine, and I am sure that whatever your

[00:45] field, you will be able to come up with ideas like these and benefit from them later. Here, for example, this site's benefit from them later. Here, for example, this site's job is to discover trends, analyze content, optimize video SEO, and write scripts—it's tailored and geared towards content creators, since that's my specialty. For example,

[01:03] here's the trend discovery section. You'd write your specialty here, like "football," and then choose the timeframe, wanting to know the football trends of the last

[01:15] seven days. Here, you can choose the countries. I've listed all the Arab countries here; I could choose Egypt, but here the data source is Google Trends or YouTube, so I'll choose both. Then,

[01:27] click here, or the user, and it starts bringing up results: "The Egyptian national team in the 2026 Africa Cup of Nations," "The Africa Cup of Nations final between Morocco and Senegal," "Al-Ahly's Morocco and Senegal," "Al-Ahly's winter transfers," "The results crisis," and so on. It starts

[01:42] bringing up topics like "Why did the Pharaohs lose the bronze medal?" and "Tactical analysis." It then gives you video ideas based on search volume. As you can see, you can start exploring any field and see what you can do.

[01:54] Here's the content analysis section; you give it the topic, and it starts suggesting content topics for you. Here, for SEO, you just write the video topic, and it gives you keywords, a just write the video topic, and it gives you keywords, a description, and hashtags. Here, you write the script; you

[02:09] give it your video topic, and it writes the script you want. I also created another site so you can start creating thumbnails. Here, you write the image idea, then you choose the image size. Here, for visual optimization, if you have a reference image, click here. Whatever your field, you can

[02:27] create applications and websites like this. For example, for cooking enthusiasts, because they're always upset that I don't give examples of them, here's an application I created in half a minute. The idea is that I list the ingredients I have. For example, I have eggs, potatoes,

[02:41] example, I have eggs, potatoes, pasta, and sauce. So, here, I start by telling it what I want to make from these ingredients. Or, I can write here what's in my kitchen, or I can take a picture of my refrigerator or the things I have and put the picture here. Okay, it will

[02:58] discover the ingredients, and then I start by telling it what I want to make in 15 minutes. For example, if you have a healthy diet and a want to make in 15 minutes. For example, if you have a healthy diet and a moderate budget, and you discover the recipe, it will start giving you the recipe based on the ingredients you provided. It's really fun, guys, and you can

[03:16] use it in any field. You can literally make any idea you have come up with work. Here are the ingredients; can literally make any idea you have come up with work. Here are the ingredients; here are three recipes, and each recipe has its own ingredients. So how do we do this? First, you go to Google

[03:32] Studio (I'll leave the link in the description). It will take you to the page you see on the left. You'll find something called "Country." Here, it asks you to describe your idea. I had an you to describe your idea. I had an idea for a website or app for doing home workouts

[03:47] idea for a website or app for doing home workouts muscle, and I gave it some details— very simple and written in very simple language. Then I click " Start." Now, let's see the result. Here, it starts building. In a

[04:02] few minutes, it will start building the website. If you want to see the code while it's being built... So, this is how it builds the website's code. As you can see, if you click on "Preview," it shows you the product or the final design. Here it is, and as

[04:17] we're talking, the website is starting to appear. It's perfect, literally. It did website is starting to appear. It's perfect, literally. It did n't even take half a minute. Here it is. Choose your fitness goal for today: weight loss and fat burning, muscle building, flexibility, and yoga. I'll say, for example, "muscle building."

[04:34] Wow! It shows me a weekly schedule. If we say, for example, "Monday," here it is. The click lasts 45 minutes, but it shows an unrelated image. We can change this image later. If you click on "Start

[04:47] change this image later. If you click on "Start Now," it will start counting down. Now," it will start counting down. The whole thing is excellent, guys. You can literally change anything you want. You can add anything you want. For example, if I want to

[05:00] can add anything you want. For example, if I want to change the website name or the app name, I'll tell it to change the website name or the app name, I'll tell it to change the website name from " change the website name from " Fight Home" to a question mark in Arabic.

[05:14] Fight Home" to a question mark in Arabic. Let's see. Click here. So, it starts to change. See, it's different now, it's called a question mark. You can remove something, add something, all of that is available to you through the chat. You write what you want, and it starts giving you suggestions. For

[05:30] example, it might say, "Here, track your workout progress," or "Customize the workout duration." It starts giving you suggestions like adding new exercises and smart notifications. I can tell it to add new exercises,

[05:42] and it will start adding new ones. I can remove something, add something, or change the color. That's it, and it starts adding more exercises. As you can see, now you can unleash your imagination and modify the site however you want. Anything you want, you write here in the chat, and it will start showing you the

[05:58] write here in the chat, and it will start showing you the result. If you want to remove something or undo it, you click "Restore." That's what I did until I reached the result that I'm honestly happy with in this content creator assistant I created. Now, let's say I want to send

[06:15] this application to someone To try or modify it, click on Share Up, then click on Publish Your Up and select Date. Here, if you want the user to open the entire page or view it in full

[06:27] screen, select that option. Copy this link and send it to the person you want to try or modify the site. Be aware that they will see everything; it will open in

[06:40] will see everything; it will open in Google Studio and show them the source code and everything else Google Studio and show them the source code and everything else you've created. You can also upload the site to GitHub. Now, if you want to do a more professional job and upload the site to a hosting service with a

[06:55] domain name, so that it becomes, as I mentioned, an idea for an online project where you can add mentioned, an idea for an online project where you can add ads, make it a paid subscription as you wish, all you have to do is click on Download Up here. The

[07:10] site files will start downloading in the compressed format you see here. Then, right-click on them compressed format you see here. Then, right-click on them and select Extract. So, the files are downloaded, as you can see. These are the files. I can change the

[07:26] folder name here to English. I'll write anything, for example, "What?" First, I downloaded my website files here to upload them to the hosting. This compressed file is

[07:38] no longer needed. The next step is to take these files and put them on our hosting, but these files aren't ready to be put on the hosting in the way you see them. That's why you go to something called Nodes. I'll leave a link to

[07:55] this tool in the description. Go to it. It's a simple process, but pay attention to the steps. This website will open. This website will build the files that we can use to add

[08:08] our website to any hosting you want. Then, scroll down a bit. If you're using Windows, leave it as Windows. If you're using Mac or Linux, choose the operating system you want. I'm using Windows, so I'll leave it as Windows. Then, click on this option. So the tool will start downloading, as

[08:25] you can see. It will look like this. Then you just click "Next" as usual. The next step is to copy this keyword ( I'll also leave it in the description)

[08:37] to make sure NOD32 is installed. Go to the search bar and type " COM," then select this option. Next, paste the copied keyword and

[08:49] press Enter. If it displays "in" followed by a number, then you're all set; the tool is installed. This number might change; it's the NOD32 version number. So you're all set. The

[09:01] next step is to go to the folder where we put the files. Open it. Then, in the top bar, click and type "

[09:14] CMD" and press Enter. This will open the path to the file. Pay attention and focus on this point; let's repeat it. You go to... The this point; let's repeat it. You go to... The folder containing the website files is located

[09:29] here. In the top bar, click the command, then type "cmd" and press Enter. This will open the window you see here. Here 's the link or path to the files.

[09:41] 's the link or path to the files. Next, copy the phrase "npm install" and go to our tool and paste it here. Then press Enter. Wait a moment, don't do anything else. That's perfect! As long as it says "here" in green (

[09:57] zero) and you see this window, the process is complete. There's one final step: copy this text again, then go back to our tool and

[10:09] paste it here. Then press Enter. The index file has been created. Now, if we go to the folder we named "Ayman," you

[10:21] 'll find additional files that have added this file. We put it, or this folder contains two files; these are what we put inside the hosting. So, we

[10:34] did all these steps to get the index file. Okay, great. If you have hosting, you start by logging into your hosting account. I'm using Hostinger, of course. Log in to your

[10:46] hosting, and in the sites menu, click, for example, on "Add Site" and choose " on "Add Site" and choose " PHP HTML." Here, you enter your domain. I'll explain PHP HTML." Here, you enter your domain. I'll explain

[11:02] domain if you don't have hosting, but I'm explaining this assuming you already have hosting. For now, we used a temporary domain for this explanation, and then I'll explain the steps again. Here, you configure the dashboard settings. Okay, great. Now, we go to the file manager, and

[11:20] we go to the file manager, and then you go to "Public HTML." then you go to "Public HTML." click on it. Then you click on Delete. Delete, that's it, perfect. Then you shrink it

[11:36] a little. This one's no longer needed. Open the folder and shrink it a little more. Now we're in the files. Here they are. Now we'll go

[11:48] we're in the files. Here they are. Now we'll go to the DISTINCT folder and take these two and drag them here. That's it. These are the files that will run our website. Then we'll go back to the control panel and click on our domain. Notice

[12:05] how it works perfectly now. Of course, I used a temporary domain just to test it for you. If you don't have hosting, how do you get it through Hostinger? I chose Hostinger because it's one of the cheapest platforms that offers hosting. I'll leave

[12:22] their link in the description. You can get hosting from as low as $49 a month, but this is single hosting, so you only put one website on it. But

[12:36] I I strongly advise you to choose at least Premium or Business plans. Premium allows you to add up to three websites, while Business allows up to 50. This is the plan I prefer and

[12:49] always use. Click on " Choose Plan," and it will take you to a page where Choose Plan," and it will take you to a page where you can choose 12, 24, or 48 months. The more months you choose, the more you save. For example, if you choose 48 months, the monthly cost is

[13:06] For example, if you choose 48 months, the monthly cost is $3.29. You can add $3.29. You can add 50 websites to this hosting plan—imagine 50 websites for 50 websites to this hosting plan—imagine 50 websites for that price! If you prefer 12 months, the price is

[13:19] that price! If you prefer 12 months, the price is slightly higher at $5.79. This is the base price, but the more slightly higher at $5.79. This is the base price, but the more months you choose, the lower the months you choose, the lower the price and the higher the discount. Let's say

[13:32] price and the higher the discount. Let's say we chose 12 months; that would cost we chose 12 months; that would cost $69. You can use 50 websites for those 12 months, as I mentioned. $69. You can use 50 websites for those 12 months, as I mentioned. You'll click on "Do you have a

[13:45] coupon code?" Then you'll enter the value code (the one with the question mark, as you can see) and click " question mark, as you can see) and click " Apply." It will then give you an additional discount. I'll leave the Apply." It will then give you an additional discount. I'll leave the value code here in the description; it's 64. Of course, it's

[13:58] 64 because I chose Business. You can choose Premium or Single, and the number will be much lower. Then you click " Continue." Of course, you have to register with any email address

[14:10] you have. It will then ask you to enter some of your information. You enter your information and click "Continue." After that, you choose your payment method. They have Visa,

[14:22] PayPal, CoinGata, and Fawry. All payment methods are available. After you complete the payment process, you log into your

[14:35] Hostinger account. You'll find the hosting service on your homepage. Here's the homepage; you'll find the hosting service there. Now we'll start by going in like this. It will tell you, "

[14:47] Who is this site for?" I'll tell it, "For me and my business." And I'll tell it, "Next." You can skip all of this, problem. But I'll tell it to create a website. And I'll tell it, " Next." And then I'll leave

[15:00] Next." And then I'll leave all of this and choose HTML/PHP. Click on it. Now we'll start here. We'll choose the domain of the site. And this domain is the address of the site. For example, Facebook 's domain is www.

[15:15] Facebook.com, so your website also needs a name. For example, I could write " name. For example, I could write " Trend Finder" because it's about discovering trends. Then it will start giving me suggestions. I want something that starts with ".com," so I start searching for ".com." If I do

[15:32] n't find it, I can choose any of these. But you can also remove a letter or add a number as you like if you want it to be ".com," which is honestly the best option. For example, this will be " .com." This is available as long as it has a checkmark, so you can register it.

[15:48] Then you click "Next" and continue the rest of the steps as we explained at the beginning. When you register the domain, the domain name is here. Then you click on the you click on the control panel, which takes you to the file manager.

[16:03] Click on the file manager and continue the rest of the steps as we explained at the beginning. You go to the HTML and delete anything that's there and add the files we mentioned. Then it will be add the files we mentioned. Then it will be You have this website with its link;

[16:18] you can send it to anyone, and anyone can use it. As for hosting, I strongly recommend As for hosting, I strongly recommend Hostinger hosting. It's one of the easiest, fastest, and cheapest hosting providers you'll find on the market. I'll leave the link in the description. I hope this

[16:35] video is helpful to you. Peace, mercy, and blessings of God be upon you. Yeah.

More from Ayman safwat - علامة استفهام

View all

⚡ Saved you 0h 16m reading this? Transcribe any YouTube video for free — no signup needed.