Comment Créer un Site Web à +10’000€ Avec Claude Code (En 20 Minutes) — Transcript

Full transcript

1. 0:00In this video, I will reveal all my
2. 0:01secrets for generating a website worth
3. 0:03over € 10,000 using low-code. You
4. 0:05know that kind of result you see on
5. 0:07screen right now? Well, by the end of
6. 0:09this video, you'll be able to do the
7. 0:10same, even if you’ve never built a
8. 0:12site and don't know how to code at all.
9. 0:14We'll simply set up Claude, give it a
10. 0:16single copy-paste prompt with the right
11. 0:18elements, refine the result, and then
12. 0:20put the site online with a real domain
13. 0:22name. Today, many people use Claude
14. 0:23incorrectly, and that’s why we see
15. 0:25more and more AI-created sites that are
16. 0:27generic and all look the same. But in
17. 0:29this video, the goal is actually to do
18. 0:31the opposite. We are going to create a
19. 0:33site that looks like it was made by a
20. 0:35developer or an agency charging over
21. 0:36€ 10,000, without anyone being able
22. 0:38to guess it was created with AI. To
23. 0:39achieve this result, we first need to
24. 0:41understand what makes a site feel
25. 0:43high-end. Because between a site worth
26. 0:44a few hundred euros and one worth over
27. 0:46€ 10,000, the difference doesn't
28. 0:48necessarily come from the content
29. 0:49quality, but mainly from how each
30. 0:50element is crafted. So, I decided to
31. 0:52ask Claude what makes the difference
32. 0:54between a € 200 site and a € 10,000
33. 0:56site. And it replied that it mainly
34. 0:58comes from how each element is crafted.
35. 1:00It involves more refined typography, a
36. 1:02real visual hierarchy, better-mastered
37. 1:04spacing, less generic layouts with more
38. 1:06original sections and compositions, a
39. 1:09true artistic direction with colors,
40. 1:11shapes, textures, and visuals that are
41. 1:13coherent; but above all, everything
42. 1:15that brings that ultra-premium finish,
43. 1:17such as animations, motion design,
44. 1:19scroll effects, micro-interactions, and
45. 1:22hover effects. It is the combination of
46. 1:24all these details that makes a site
47. 1:25immediately appear much more premium.
48. 1:27And with Claude, when used correctly
49. 1:28with the method I will present in this
50. 1:30video, you can very easily reach this
51. 1:32level of results, even if you are a
52. 1:34complete beginner in website creation.
53. 1:36So now, we are going to see how to do
54. 1:37all this step by step. Let's go. Okay,
55. 1:40so before we start building our site,
56. 1:42I'll take a quick 30 seconds to start
57. 1:44from scratch and explain how to
58. 1:46configure Claude, install Claude, and
59. 1:48so on. So, as a first step, you are
60. 1:49going to go to claude.ai and simply
61. 1:51create an account. I will put all the
62. 1:53sites I mention in this video in the
63. 1:55description for you. So, simply create
64. 1:56an account and then we will be able to
65. 1:58move on to the next step. Once you have
66. 2:00landed on this page, you will need to
67. 2:02select a plan. Unfortunately, the free
68. 2:03plan does not give us access to Claude
69. 2:05Code, and Claude Code is what will
70. 2:07allow us to create truly
71. 2:08ultra-professional sites. So, what I
72. 2:09recommend if you want to use Claude in
73. 2:11a moderate way, meaning to create
74. 2:13websites, perform tasks, and so on, the
75. 2:15Pro plan is more than enough. If you
76. 2:17want to have intensive usage, let's say
77. 2:18, you can go for the Max plan. But in
78. 2:20any case, to follow this tutorial, the
79. 2:22Pro plan is entirely sufficient. So we
80. 2:24will choose this Pro plan, and once you
81. 2:26have subscribed, you will simply need
82. 2:28to download the desktop application. I
83. 2:30will let you download all that and
84. 2:31install the application, and I will see
85. 2:33you after for the final settings we
86. 2:34need to configure on the desktop app.
87. 2:36Once you have installed the desktop
88. 2:37application, you should land on a page
89. 2:39more or less like this. Obviously,
90. 2:40depending on the versions, it might
91. 2:42change, but don't worry, it will always
92. 2:44be something quite similar. So here, we
93. 2:46are on the standard version of Claude.
94. 2:47For that, you have a tab here which is
95. 2:49the code version. It might be displayed
96. 2:51differently on your version; maybe it
97. 2:52is written "Code" somewhere. But in any
98. 2:54case, try to find the code version and
99. 2:56click on it like this. Now we have just
100. 2:58landed on Claude Code. It is possible
101. 3:00that it asks you to install Git or
102. 3:01something like that. If that is the
103. 3:02case, don't worry, it is really very
104. 3:04simple to install. And if you ever
105. 3:05struggle, you can always take a
106. 3:07screenshot of the messages it shows and
107. 3:08give them to ChatGPT, for example, and
108. 3:10it will guide you through installing
109. 3:12Git. Once all that is done, we will
110. 3:13very quickly have a few little settings
111. 3:15to take care of. Already here, it tells
112. 3:16us that we have no folder. So here,
113. 3:18simply put, we will need to give Claude
114. 3:20access to a folder. An empty folder,
115. 3:22that is. This way, it will be able to
116. 3:24add all the code it creates. So here,
117. 3:25we will simply click on it to open a
118. 3:27folder. We'll go to the desktop, I'll
119. 3:31create a new folder, name it DIK site
120. 3:33for example, then click create and open
121. 3:36. Next, the other setting to adjust is
122. 3:39here, where you can choose the model
123. 3:41version you want. I always recommend
124. 3:43using the most powerful model you have
125. 3:45access to for building a site. I have
126. 3:47access to fable.1, but only because I
127. 3:50have the max version of Claude Code.
128. 3:52But to be in the same position as you,
129. 3:54I'll choose the O + 5 version, which
130. 3:55you should have too. If you're watching
131. 3:57this video months after its release,
132. 3:59don't worry, the tutorial is still
133. 4:01current, and you'll likely have newer
134. 4:03models available. So, always feel free
135. 4:05to pick the most powerful model you
136. 4:07have access to. For me, if I were on a
137. 4:09standard plan, it would be O + 5. So,
138. 4:11I'll stick with that. Then here, we can
139. 4:13also configure the effort. The closer
140. 4:15we set it to "fast," the less effort
141. 4:17the AI puts in, and the fewer credits
142. 4:18it consumes. Conversely, the more you
143. 4:20set it to "intelligent," the more
144. 4:22credits it consumes as the AI puts more
145. 4:24effort into the code. I recommend
146. 4:25setting it to "max." That will be more
147. 4:27than enough, especially with the
148. 4:29current models. Honestly, there’s no
149. 4:30need to burn through all your tokens.
150. 4:32The max mode and O + 5 are already more
151. 4:34than sufficient. So, if you're watching
152. 4:36this months later, it will still work
153. 4:38perfectly fine for you. You can stick
154. 4:39with the latest available model and set
155. 4:41it to max mode without any issues. Now
156. 4:43that everything is set up and we're all
157. 4:45on the same page, we can move to the
158. 4:47first step of creating our site. The
159. 4:48first step in creating a € 10,000 +
160. 4:50site is to define an ultra-premium
161. 4:52visual style. The best way to do that
162. 4:54is to take inspiration from the best. I
163. 4:56invite you to visit style.ferro.design
164. 4:59because this site compiles many
165. 5:01ready-to-use design systems we can feed
166. 5:03directly into Claude. And these aren't
167. 5:06just random corporate design systems.
168. 5:08No, these are design systems from
169. 5:09companies that spent tens or even
170. 5:11hundreds of thousands of euros on them.
171. 5:13For example, if I scroll a little bit,
172. 5:15you can see that we have Apple's site
173. 5:17here, and the Notion site. There are
174. 5:19over 2,000 references, but most
175. 5:20well-known startup sites valued at
176. 5:22millions are referenced here, like
177. 5:24Lingo, for example. And what's great is
178. 5:27, for instance, if I go—I don't know
179. 5:29—I'll take the Apple site like this.
180. 5:32Here, we'll see a whole style that we
181. 5:34can directly copy and give to Claude so
182. 5:36it can draw inspiration from it to
183. 5:38generate a site that won't look like
184. 5:40AI-generated content we see everywhere,
185. 5:42but rather an ultra-premium site with
186. 5:44attention to detail and all the
187. 5:46hallmarks of a site worth tens of
188. 5:48thousands of euros. So, what we'll do
189. 5:51now is go back and simply choose a
190. 5:53design style that interests us. For me,
191. 5:56for this tutorial, I know there is the
192. 5:58Stripe design system, and I will use
193. 6:00this one for this tutorial. So, I'm
194. 6:02just going to type Stripe. You can
195. 6:05either type it in, or use the filters
196. 6:06here to search for what you want, or
197. 6:08you can simply browse through the
198. 6:10different sites they offer like this.
199. 6:12So, I'm going to go with the one for
200. 6:14Stripe. I'll click search, and there
201. 6:17you go, I have the Stripe design system
202. 6:19. Stripe is a very well-known site. I
203. 6:21think it's a site that is truly a work
204. 6:23of art in terms of design, code, and so
205. 6:25on. It's really very well done. So, I
206. 6:27will show you that with this method, we
207. 6:29can easily get a site that is very
208. 6:30close to it without actually
209. 6:32copy-pasting the site. No, we will
210. 6:33really be able to make it our own and
211. 6:35turn it into our own unique site that,
212. 6:37however, follows all the codes of the
213. 6:39premium site we were inspired by. So
214. 6:41here, what I'm going to do is simply
215. 6:43copy the reference style like this, and
216. 6:45then I'll go back to Claude Code. Now
217. 6:48that we're in Claude Code, I'm going to
218. 6:49type a fairly simple prompt, and you'll
219. 6:51see that Claude will generate a truly
220. 6:53extraordinary site. So the first prompt
221. 6:55, the first instruction we're going to
222. 6:57give Claude Code, won't be any longer
223. 6:58than this. It will be: create an
224. 7:00ultra-animated site with hover and
225. 7:02scroll effects for my AI consulting
226. 7:04agency. Drawing inspiration from this
227. 7:06style—and here we will simply paste
228. 7:08the style we copied earlier from the
229. 7:10site I showed you. So, for now, we
230. 7:12don't need to do anything else. We'll
231. 7:14generate the site, and then later, we
232. 7:16can tweak our text, add more detail,
233. 7:18and make small adjustments if needed.
234. 7:21You'll see, you're going to be amazed,
235. 7:23because with just this prompt, you'll
236. 7:25see a result that honestly rivals the
237. 7:27top 1%of designers from a year ago. All
238. 7:29of this was unthinkable a year ago, but
239. 7:31now, with a single prompt, I'm going to
240. 7:33run it. And you'll see the result for
241. 7:36yourself. So now, we're going to wait a
242. 7:38few minutes. It could take 10 to 15
243. 7:40minutes. You should know that Claude
244. 7:42really generates very high-quality code
245. 7:44. Plus, we’ve set it to max mode, so
246. 7:45it will generate some very professional
247. 7:47code. So for that, you have to be a
248. 7:49little patient. We’ll wait about 15
249. 7:51minutes, and then I’ll be right back
250. 7:53to show you the result. A quick note
251. 7:55before the result: Claude will ask for
252. 7:57permissions like this to be able to
253. 7:59write to the folder we created earlier.
254. 8:01So, make sure you always click "allow"
255. 8:03like this. You can even switch to auto
256. 8:05mode and continue, so you won't need to
257. 8:08keep clicking "allow"—it will do it
258. 8:10by itself. And now, it’s going to
259. 8:11finish creating the site, and we’ll
260. 8:13meet back up once the site is created.
261. 8:15Okay, so Claude Code has finished
262. 8:17developing the site I asked for. It has
263. 8:19given us a local link, and we’ll
264. 8:21simply click on it to get a preview of
265. 8:23our site. There we go. So here is our
266. 8:25site. Now, as I said, it’s local,
267. 8:27meaning it isn’t online yet. I’ll
268. 8:29show you later how to publish your site
269. 8:31and make it accessible to the whole
270. 8:32world. But for now, what we can see is
271. 8:34that we have a very nice site. If this
272. 8:36isn't your first site made with AI, you
273. 8:38might notice it has real style, a real
274. 8:40personality, and ultimately, it doesn't
275. 8:41look like all the other AI sites you
276. 8:43see. We really have a site here that
277. 8:45pays attention to detail. You can see
278. 8:47that if I hover my mouse, for instance
279. 8:49here, there are slight neural network
280. 8:50effects that interact with the cursor.
281. 8:52It's exactly these kinds of small
282. 8:54details that make a site ultra-high
283. 8:56quality. Also, if I hover my mouse over
284. 8:58the visual here, we can see it reacts a
285. 9:00little bit. We also have a small
286. 9:02animation here. So I'm going to scroll
287. 9:04a bit on the page. There we go, lots
288. 9:06more animations. We can see it reacting
289. 9:09and appearing as we scroll. Here, we
290. 9:11have some cards. If I hover my mouse,
291. 9:13there's a really nice animation that
292. 9:15looks great and makes the site feel
293. 9:17very high-quality overall. Alright, I'm
294. 9:20going to keep scrolling down here.
295. 9:22There we go, now we have cards that
296. 9:24rotate and react to the page scroll. So
297. 9:26, I keep scrolling down, but it scrolls
298. 9:29horizontally. That also adds a very
299. 9:31premium feel. I'll head down a bit
300. 9:33further, we'll see some case studies.
301. 9:35There we go, it's great. Yet another
302. 9:38animated section that looks really good
303. 9:40. Here, I have some customer
304. 9:42testimonials. So, a carousel has been
305. 9:44set up. There it is. So that's great.
306. 9:47An FAQ, and at the bottom of the page,
307. 9:49we'll have a call to action and the
308. 9:51footer. Honestly, I am really blown
309. 9:53away by the result. Truly, we have an
310. 9:55ultra-premium, really high-quality site
311. 9:57. For now, we only have the home page.
312. 9:59I'm going to make a few small changes
313. 10:01to this home page. Once it's approved,
314. 10:03I'll ask it to generate all the other
315. 10:05pages, and then we can put it online.
316. 10:07So, what I'd like to change here is
317. 10:08that I'm not really a fan of this
318. 10:10visual. I think it adds a bit too much
319. 10:12text in this area, considering there's
320. 10:14already quite a lot of text here. So, I
321. 10:16think I'll ask it, since I like this
322. 10:18kind of neural network that reacts to
323. 10:20the scroll, to add a bit more of it
324. 10:22here, to have this animation a bit
325. 10:24denser in this area. And that way,
326. 10:27we'll have a part here with text and a
327. 10:29part here that's a bit more visual.
328. 10:31Next, I'm going to scroll down a little
329. 10:33bit. Uh, there we go. I think it's
330. 10:35actually pretty good. Maybe to pace the
331. 10:37page a bit better, I'll ask it to put
332. 10:39the method section on a dark background
333. 10:41. Uh, that could be nice. And
334. 10:44potentially the testimonial section on
335. 10:46a dark background as well. That way,
336. 10:48it'll pace the page a little better.
337. 10:49And here, however, rather than having
338. 10:51key figures and more text, I'm going to
339. 10:53ask it to create a visual here. Here
340. 10:55for example, the call to action
341. 10:56suggests booking a 30-minute
342. 10:58appointment. So here, I'm going to ask
343. 11:00it why not add a calendar with an
344. 11:01animation here. So we're going to go
345. 11:03through it section by section. So,
346. 11:05first section, there we go, I'm going
347. 11:07to go back to Claude code and simply
348. 11:09give it my instructions for the changes
349. 11:11. So first edit, I'm going to tell it
350. 11:13in the hero area, remove the visual on
351. 11:14the right and add instead a neural
352. 11:16network similar to the one that already
353. 11:18exists but denser and interactive that
354. 11:20reacts to mouse cursor movement. So
355. 11:21there, I'm going to tell it that. Next,
356. 11:23I'm going to give it my second
357. 11:25modification. I'm going to tell it to
358. 11:27adapt the method and testimonials
359. 11:28sections to a dark background. I'm
360. 11:30going to send that to it. And my last
361. 11:32modification, I'm going to ask it to
362. 11:34add a visual/an illustration in the
363. 11:36final call to action. So a CTA is a
364. 11:38call to action. So in the final call to
365. 11:40action on the right, instead of the key
366. 11:42figures, show a calendar to book a call
367. 11:44slot with a mouse cursor choosing a
368. 11:45date and time. I'm going to send that
369. 11:47to it as well. Then we're going to wait
370. 11:49for all these modifications and I'll
371. 11:50show you exactly what it did. OK. So
372. 11:52Claude has finished with the
373. 11:53modifications I asked for. As we can
374. 11:55see, we have a really superb hero
375. 11:57section. The hero section is the first
376. 11:59part of your site and as you can see,
377. 12:01we have a nice neural network like this
378. 12:03that reacts to the mouse cursor. If I
379. 12:04scroll down, we'll see that it has
380. 12:06taken my other modifications into
381. 12:08account. So here, we can see now that
382. 12:09it has switched this section to a dark
383. 12:11background. It's much better this way.
384. 12:13It adds a bit of rhythm to the page. It
385. 12:15removes the slightly boring aspect,
386. 12:16shall we say, of having a whole site
387. 12:18with a white background. So there,
388. 12:20we'll continue like this. Same thing
389. 12:22here, customer reviews stand out much
390. 12:24better like this. So we really have a
391. 12:26very high-quality site here and we have
392. 12:28the call to action here to book an
393. 12:30appointment and as a result, an
394. 12:31animation of a calendar with a cursor
395. 12:33booking an appointment. There you go,
396. 12:35to illustrate the act of booking an
397. 12:37appointment, of having a free 30-minute
398. 12:38meeting. So, honestly, the site is
399. 12:41perfect. It's a very, very beautiful
400. 12:43site. What we're going to do now is
401. 12:45simply ask Cloud to generate the rest
402. 12:47of the pages to have a complete site,
403. 12:49and then we'll put it online. For that,
404. 12:51we go back to Cloud Code, and here I'm
405. 12:52just going to tell it to generate the
406. 12:54rest of the pages. So here, I'll say
407. 12:56perfect. There, perfect. Generate the
408. 13:02other site pages now. There. And there,
409. 13:05it will simply generate the other pages
410. 13:07of the site. So, Cloud has generated
411. 13:08all the pages for my site. So if I
412. 13:10scroll up a little, it will tell me a
413. 13:12bit about what it did. And it also
414. 13:13reminds us that before going live,
415. 13:15don't forget that this is demo content.
416. 13:17I'm not making a real site here, but
417. 13:19you should, of course, adapt the
418. 13:20content of your site with Cloud. So, if
419. 13:22you give it the essential information
420. 13:24about your business, what you do, your
421. 13:26services, who you are, etc., it will be
422. 13:28able to generate the content, like the
423. 13:30text and so on, for your site itself.
424. 13:32So if I scroll up a little, there,
425. 13:33we'll be able to go back to the site.
426. 13:35So, my site is still there. Perfect.
427. 13:38And on top of that, well, we'll see
428. 13:40different pages. So we'll see the
429. 13:42expertise page. There. So it's great,
430. 13:45the method page is just as premium.
431. 13:48There, so we have some very beautiful
432. 13:50pages, which is top-notch. Well, I
433. 13:52won't go through all the pages, but
434. 13:55there, we have plenty of pretty pages,
435. 13:57and especially we'll see the contact
436. 14:00page as well, with a contact form.
437. 14:02There, we'll even have the option to
438. 14:04select things, send the request, and so
439. 14:07on. And so now the last thing we'll
440. 14:09need to do is simply put our site
441. 14:11online on our own domain name and, most
442. 14:13importantly, ensure it is hosted as
443. 14:15well. So to do that, what we'll do is
444. 14:17go through Hostinger. For me, it's the
445. 14:19best in terms of value for money and
446. 14:21simply one of the best hosts. It
447. 14:23doesn't cost very much, it's about €
448. 14:254 a month. Keeping in mind that you can
449. 14:27publish an unlimited number of websites
450. 14:29on Hostinger. So even if you have sites
451. 14:30to build for clients or for, I don't
452. 14:32know, family, your friends, etc., now
453. 14:34that you know how to build premium
454. 14:35websites. If you ever want to build
455. 14:37multiple websites as well. So it really
456. 14:39is the perfect plan. What we'll do on
457. 14:40top of that is we'll be able to easily
458. 14:42connect Cloud to Hostinger. It will
459. 14:44really make our lives easier because
460. 14:45afterwards from Cloud, we can make
461. 14:47changes and tell it to republish them
462. 14:49to our host or if there's the slightest
463. 14:50issue on the site, well Cloud can
464. 14:52investigate it itself. There's no more
465. 14:54need to pay for maintenance or anything
466. 14:55like that. Now Cloud will be your agent
467. 14:57, your employee there to work on your
468. 14:59site, update it, manage security, and
469. 15:01so on. So to access Hostinger and
470. 15:03specifically the page that will allow
471. 15:05us to connect Hostinger to Cloud, I
472. 15:06invite you to click on the first link
473. 15:08in the description. Once we arrive on
474. 15:10this page, we'll simply choose a plan.
475. 15:12So here, we'll click on get a plan like
476. 15:14this. And there, as a result, we'll
477. 15:16have two plans. So the unlimited plan.
478. 15:18With that, you'll be able to make as
479. 15:19many sites as you want. You have an
480. 15:21unlimited number of sites included in
481. 15:23this offer and you also get a free
482. 15:24domain name. So that's perfect. So for
483. 15:26just under € 4 per month, you will
484. 15:28have, well, as many sites as you want,
485. 15:29practically. So we'll choose this offer
486. 15:31here. And here we can already see that
487. 15:33it's offering us the 48-month pack. So
488. 15:35we'll rather choose the 12-month one
489. 15:37like this. And we'll even add a promo
490. 15:39code to get an extra discount. So here
491. 15:42I'll type the code WEB10 like this and
492. 15:44I'll click on apply. There you go. So
493. 15:47for one year, for 12 months, we'll end
494. 15:49up at € 52. This includes your domain
495. 15:52name and the hosting of your site so
496. 15:53it's online and accessible 24/7
497. 15:55everywhere in the world. So we'll click
498. 15:57on continue and then we'll simply
499. 15:59create an account. So I'm going to
500. 16:00create an account and once I've signed
501. 16:02up, I'll see you afterwards. Next,
502. 16:03we'll arrive on this page. So here
503. 16:05we'll just enter our information and
504. 16:07then we'll click on continue. And now
505. 16:09we'll simply proceed to payment. By the
506. 16:11way, I remind you that you have a 30-
507. 16:13day money-back guarantee. So you really
508. 16:15take no risks. So I'm going to proceed
509. 16:16to payment and I'll see you right after
510. 16:18. There we go. So once the payment has
511. 16:20been made, we'll arrive on this page.
512. 16:22So, this will be the Hostinger
513. 16:23onboarding. We'll be redirected here,
514. 16:26so let's leave this page because we
515. 16:27won't be creating a site from Hostinger
516. 16:29. We are going to connect Hostinger to
517. 16:33Cloud so we can manage our site and
518. 16:34publish changes directly from Cloud
519. 16:36without needing Hostinger. The only
520. 16:39thing we'll do in Hostinger is go to
521. 16:41the domain name section. And there, if
522. 16:43you recall, we had a free domain name
523. 16:45included in the plan. So we’ll simply
524. 16:47go and claim our free domain name here,
525. 16:49like this. We’ll choose to register a
526. 16:51new domain, unless you already have one
527. 16:53. You can transfer it here. We'll
528. 16:55select register a new domain and
529. 16:57continue. Now, we’ll just enter our
530. 16:59business name, dot com, dot fr, etc.
531. 17:01Basically, setting our site address.
532. 17:03For example, the fictional site that
533. 17:05Cloud created for me was Axorea. So
534. 17:07I’ll type Axoreaia. Maybe it's
535. 17:11available. No, it’s not available.
536. 17:13I’ll go with axoreaia.com because I
537. 17:16imagine Axorea is already taken. There
538. 17:18we go, axorea-ia.com is available. So
539. 17:22I’ll just select it and click next.
540. 17:24Here, I’ll confirm to claim the
541. 17:26domain name. And now, I need to
542. 17:28register my domain name with my contact
543. 17:30details. This is mandatory. I'll do
544. 17:32that on my end and meet you at the next
545. 17:34step. Okay, now it’s registering my
546. 17:36domain name. And there, it's perfect.
547. 17:38So, my domain name has been
548. 17:39successfully registered. I’ll click
549. 17:41on continue. It might offer you some
550. 17:42extra deals here. We aren't interested.
551. 17:44We’ll scroll to the bottom and click
552. 17:46on skip for now. There’s nothing else
553. 17:47to pay, I want to reassure you of that.
554. 17:49And there we go, we’re all set.
555. 17:50Everything has been configured
556. 17:52correctly. Now, what we’re going to
557. 17:54do is connect Hostinger to Cloud. To do
558. 17:56that, we’ll return to the same page
559. 17:57we used to get our subscription. You
560. 17:59can either click the same link in the
561. 18:02description or type hostinger.com/cloud
562. 18:04. Make sure to include the domain
563. 18:06extension correctly like this. We’ll
564. 18:08head back to the same page we were on
565. 18:10earlier. To connect Cloud, we’ll
566. 18:12click on install extension here. And
567. 18:16there, quite simply, we’re going to
568. 18:18go into Cloud Code like this and
569. 18:20we’re just going to copy this line
570. 18:21here. So, we’ll copy it and then
571. 18:24we’ll head back to Cloud Code and
572. 18:26just paste the sentence in question.
573. 18:28Now, I’ll hit enter, and there, quite
574. 18:30simply, it will install the connector
575. 18:32to Hostinger. So now, we’ll wait a
576. 18:33moment and we’ll be able to directly
577. 18:35connect Cloud, then, to our Hostinger
578. 18:37account and everything on it, meaning
579. 18:38we’ll be able to manage our site, ask
580. 18:40it to make updates directly to our site
581. 18:42, and publish them. We’ll be able to
582. 18:43ask it to check for any security
583. 18:45vulnerabilities. We’ll be able to ask
584. 18:46it to do just about anything we want.
585. 18:48And as I told you, well, Cloud is
586. 18:49really going to become your web
587. 18:50assistant. It’s the one that will be
588. 18:51able to do everything you want on your
589. 18:53website without you needing the
590. 18:54slightest skill. OK, so now Cloud has
591. 18:55opened this window so I can connect it
592. 18:57directly to Hostinger. So here, I’m
593. 18:59going to click on allow, which means
594. 19:00accept. There we go. And there, as a
595. 19:02result, I have successfully
596. 19:03authenticated. Now, if I go back to
597. 19:04Cloud like this, it continues. So,
598. 19:06I’m going to tell it I’m connected
599. 19:08like this. I’ll wait a little bit and
600. 19:10, in any case, it will tell me it’s
601. 19:12good and then we’ll be able to
602. 19:13publish our site. There, it tells me
603. 19:14the connection is successfully
604. 19:16confirmed. OK, so now everything is
605. 19:18good, presumably. So, I’ll simply
606. 19:19tell it, "Can you publish my site to
607. 19:21the available domain name?" So I’ll
608. 19:23send that to it, and then it will
609. 19:24automatically publish our site to our
610. 19:26domain name to make it accessible. And
611. 19:27in just a few minutes, it was able to
612. 19:29deploy my site. So here it adds two
613. 19:31caveats. So it tells me, watch out,
614. 19:33it’s still demo content. So indeed,
615. 19:35it is content that was generated and
616. 19:37isn't real because it’s a fictional
617. 19:38agency for this tutorial. It also told
618. 19:40me to be careful with legal notices and
619. 19:42so on. So, if you want to add those,
620. 19:44you can simply ask it yourself to
621. 19:46generate your legal notices for you. It
622. 19:47will ask you a few questions, then it
623. 19:49will generate them and add them to your
624. 19:51site. Once you've added them, just ask
625. 19:53it to redeploy the site online, and it
626. 19:54will generate your legal notices. And
627. 19:56here, we can see that it has pretty
628. 19:58much done everything on its own. So, it
629. 20:00found the domain name that was on
630. 20:01Hostinger. It correctly saw that I had
631. 20:03an active subscription, the one we
632. 20:04picked earlier. It saw the different
633. 20:06files that were in our test folder. It
634. 20:08added them to Hostinger, hosted them,
635. 20:10and so on. So, it did everything that
636. 20:12was necessary. It chose servers in
637. 20:14Europe, in France, which were the best
638. 20:16suited for my audience, so to speak. It
639. 20:18did all the work in just a few minutes.
640. 20:20And now we have the site. You can see
641. 20:21my domain name here, the one I chose
642. 20:23earlier. If I click on it, we land
643. 20:25directly on my site, which is live. So
644. 20:27that’s perfect, it works perfectly.
645. 20:30By the way, I haven't shown you the
646. 20:31mobile version, but if I go to inspect
647. 20:33like this, we can see that the site
648. 20:35also works very, very well on mobile.
649. 20:37There you go, everything is perfectly
650. 20:40responsive. Everything is perfectly
651. 20:42adapted for mobile. Here, we have a
652. 20:44horizontal scroll. There, it's perfect.
653. 20:47A very nice layout on mobile.
654. 20:49Everything was truly designed like a
655. 20:52high-end, professional site, and it was
656. 20:54done in just minutes. Whereas some time
657. 20:56ago—I know, because I'm a web
658. 20:58designer by trade—this kind of
659. 21:00project used to take weeks and weeks
660. 21:02before AI. Now it's done in hours, or
661. 21:04even minutes, and most importantly, you
662. 21:07have a site online at a low cost that
663. 21:09will really impact your business and
664. 21:11your credibility. So, congratulations
665. 21:13to everyone who has created their site
666. 21:15with AI. I really hope you enjoyed this
667. 21:16video and that you are happy with the
668. 21:18results of your site. In any case, if
669. 21:20you did, don't hesitate to leave a like
670. 21:21and a comment, and I’ll see you soon
671. 21:23on Web Marketing Tuto. Ciao.