How to host a static website using Yandex.Cloud Object Storage

Heus Habr!

In hoc articulo, dicam tibi quomodo facile et simpliciter exercitum statice website utens Yandex technologiae, nempe Object PRAECLUSIO.

Ad extremum, website hosted interretialem habebis qui per nexum externum pervium erit.

Articulus hic erit utilis si

  • Inceptos elit quis justo sit amet, consectetuer eget.
  • Elit qui librarium fecit et in publico regio collocare vult ut eam amicis et locatoribus ostenderet.

About Me

Nuper eram elaborandum Saas ministerium, in quodam foro, ubi homines ludi magistri ad personalem disciplinam inveniunt. Usus est acervus Amazonum interretialium (inferius ut AWS). Sed quanto altius in project, eo plura de variis processibus ordinandi exordii nuances didici.

Sequuntur difficultates offendit:

  • AWS multum pecuniae consumebat. Cum per tres annos in Inceptis societatibus laboravi, talibus gaudiis usus sum ut Docker, Kubernetes, CI/CD, viridis instruere instruere et, ut aspirans satus programmator, eadem efficere volui. Quo fit, ut AWS 3-300 arietes menstruas concludat. Kubernetes evasit carissimos circiter 400 arietes cum minimum merces unius botri et nodi.
    PS In initio hoc facere non oportet.
  • Deinde de parte legali cogitans, de lege 152-FZ didici, de quo tale aliquid dixit: "Notitia personalia civium Foederationis Russiae reponenda est in territorio Foederationis Russicae"aliter multae quas nolui. His rebus aggredi decrevi antequam ad me desuper veniret :).

inspiratus articulus de infrastructura migrandi ab Amazonibus interretialibus ad Yandex.Cloud, decrevi accuratius studere in acervum Yandex.

In me notae clavis Yandex.Cloud haec erant:

Alias ​​competitores huius officii studui, sed tunc Yandex vincebat.

Dixi de me tibi, ut ad negotia descendamus.

Gradus 0. para locum

Primum, opus est website ut in lorem ponere volumus. Cum sim angularis elit, simplex SPA applicationis exemplum dabo, quod in interreti constituam.

PS Quis angularis intelligit vel scit de eius documentis https://angular.io/guide/setup-local, ad I step.

Inaugurare angulari-CLI ad creandum SPA sites in Angularis:

npm install -g @angular/cli

Faciamus angulari applicatione utens hoc mandatum:

ng new angular-habr-object-storage

Deinde vade ad folder applicationes et mitte ad eius functionem reprimendam:

cd angular-habr-object-storage
ng serve --open

How to host a static website using Yandex.Cloud Object Storage

Applicatio creata est, sed nondum ad hospitem parata est. Applicationem in parvam fabricam (Productionem) conveniamus ut omnia superflua removeat et tantum necessarias tabulas relinquat.
Hoc facere potes in angulo sequenti cum mandato:

ng build --prod

Ex hoc imperio, in radice applicationis folder apparuit dist cum nostro loco.

Opera omnia. Nunc ad hospitem transeamus.

1 step.

Ad locum https://console.cloud.yandex.ru/ ac deprime "Iungo" puga pyga.

Note:

  • Ad officium Yandex utendum, opus epistularum Yandex est (sed hoc certum non est)
  • Quaedam munera debebis in rationem tuam deponere in ratione personali (minimum 500 rubles).

Post prospere adnotatione et auctoritate, in ratione personali sumus.

How to host a static website using Yandex.Cloud Object Storage

Deinde in sinistro in menu debes invenire "Object Storage" ministerium, quo utemur ad locum hospitem.

Breviter in verbis:

  • Objectum Repono est fasciculus repositionis compatibilis cum technologia Amazonum similis AWS S3, quae etiam suum API habet ad repositiones ex codice administrandas et, sicut AWS S3, ad locum static hospitandum adhiberi potest.
  • In Object Storage creamus " situlas" (singulas), quae separatae sunt tabularum tabulariorum nostris.

How to host a static website using Yandex.Cloud Object Storage

Faciamus unum ex illis. Hoc facere, in servitio console deprime in puga pyga "Crea situla".

How to host a static website using Yandex.Cloud Object Storage

Forma creandi situlae has agros sequentes, per eos eamus:

  • Situli nomen. Pro simplici, idem quod angularis proiectum vocemus. angular-habr-object-storage
  • Maximilianus. magnitudine. Bet quantum ponderat situs noster, cum situs non sit conditus gratis et pro quolibet partita gigabyte, Yandex pulchre denarium solvemus.
  • Accessum ad legendum cognoscendum. Hanc "Publicam" proposuimus, quia usor debet singulas tabulas loci nostri static recipere ut in eo recte trahi possit, scripta discursum esse, etc.
  • Accessus ad indicem rerum et Obvius ad occasus legendi. Dimitte ut "Limito". Hoc necessarium est ut situla lima repositionis interna utatur ad applicationes.
  • Repono classis. Dimitte ut "Latin". Hoc significat quod noster situs frequenter visitabitur, et ideo lima quae situm faciunt frequentius receptae erunt. Plus item afficit perficientur ac mercedem (inserta pagina).

Preme β€œCare situlam” et situla creatur.

How to host a static website using Yandex.Cloud Object Storage

Nunc necesse est ut situm nostrum ad situlam admoveamus. Facillima via est prope folder aperire dist nostrum situm trahunt directe in paginae ansis utentes. Hoc commodius est quam strepitando in puga "Load obiecta", quia in hoc casu folder non transferuntur et manually in recto ordine creare debebis.

How to host a static website using Yandex.Cloud Object Storage

Ita, situs in repositione oneratur, ut users cum opportunitate accessuri repositionis praebere possumus ut a website.
Ut hoc facias, in sinistra parte tabulae deprime in tab "Website".

How to host a static website using Yandex.Cloud Object Storage

In pagina paginae situlae ut situs constituendae, elige tab "Hosting". Hic indicamus paginam principalem situs, plerumque index.html. Si applicationem SPA habes, probabiliter omnes errores etiam in pagina principali procedent, sic etiam index.html in pagina erroris indicabimus.

Statim videmus quaenam situs noster pervius erit. Preme salvum fac.

Post circiter 5 minuta, strepitando in nexu, videmus nostrum situs nunc omnibus praesto esse.

How to host a static website using Yandex.Cloud Object Storage

Gratias omnibus, qui perlegit usque in finem! Hic primus articulus est: cogito insuper alias officia Yandex describere et earum integrationem cum technologiae frontendi et retroire.

Scribe in commentatione quam interest te discere de aliis officiis Yandex, vel de usu angularis in recentiori evolutione.

Source: www.habr.com