Читаоци попут вас помажу у подршци МУО. Када обавите куповину користећи везе на нашем сајту, можда ћемо зарадити провизију за партнере. Опширније.

Реацт је популарна ЈаваСцрипт библиотека за изградњу функционалних корисничких интерфејса у динамичким веб апликацијама. Можда сте провели много дугих сати, отклањајући грешке у Реацт коду у покушају да направите следећи Инстаграм или Аирбнб.

Без обзира на то шта градите, крајњи циљ је увек да покажете свој рад свету. Овде су корисне платформе за хостовање као што је Нетлифи. Они пружају скуп алата који поједностављују процес имплементације.

Пратите даље да бисте научили како да примените своје Реацт апликације користећи Нетлифи алате за примену лаких за коришћење.

Шта је Нетлифи?

Нетлифи је платформа за развој заснована на облаку са функцијама које чине хостовање и постављање апликација на вебу много лакшим. Једноставно речено, пружа низ алата и услуга које поједностављују и поједностављују процес омогућавајући вам да поставите и хостујете веб апликацију у року од неколико секунди.

instagram viewer

Главне карактеристике Нетлифи-а

Нетлифи има низ функција које поједностављују процес имплементације.

  • Пружа основне функције приступа и контроле верзија како би развојним тимовима омогућио ефикасну и ефективну сарадњу на пројектима.
  • Нуди сигурне услуге хостинга које можете прилагодити својим потребама. Поред тога, обезбеђује аутоматизоване резервне копије у случају губитка података.
  • Беспрекорно се интегрише са популарним сервисима за развој облака као што су ГитХуб, ГитЛаб и Битбуцкет.
  • Пружа функције које олакшавају подешавање и конфигурисање прилагођеног УРЛ-а домена и ССЛ сертификата за вашу апликацију.

Направите Демо Реацт апликацију

  1. Да бисте започели, прво ћете морати направите демо Реацт апликацију који ћете на крају поставити на Нетлифи. Покрените наредбу испод на свом терминалу да бисте креирали Реацт апликацију:
    нпк цреате-реацт-апп демо-реацт-нетлифи-апп
  2. Затим покрените ову терминалну команду да бисте покренули развојни сервер:
    нпм старт
    Само напред и погледајте резултате у свом претраживачу на http://localhost: 3000.
  3. Коначно, покрените ову команду да бисте креирали верзију ваше апликације спремну за производњу:
    нпм рун буилд
    Ова команда генерише потребне производне датотеке и средства унутар нове фасцикле у основном директоријуму под називом, буилд. Фасцикла за изградњу обухвата умањену верзију целе апликације, која садржи све што је потребно за примену апликације.

Поставите Реацт апликацију на Нетлифи

Нетлифи пружа три методе које можете да користите да примените своју Реацт апликацију. Можете:

  • Увезите свој пројекат са хоста Гит спремишта као што је ГитХуб.
  • Користите функцију превлачења и испуштања.
  • Користите алатку командне линије, Нетлифи ЦЛИ.

Поставите користећи ГитХуб функцију увоза

  1. Старт би креирање спремишта на ГитХуб-у за смештај ваших пројектних датотека Реацт апликације. Алтернативно, такође можете да хостујете своје пројектне датотеке на било ком другом подржаном Гит провајдеру као што је ГитЛаб, Битбуцкет или Азуре ДевОпс.
  2. Затим се пријавите за налог на Нетлифи. Када се пријавите, идите на контролну таблу свог налога и изаберите Сајтови таб.
  3. Кликните на Увоз из Гит-а дугме.
  4. Изаберите платформу жељеног Гит провајдера. Нетлифи ће од вас затражити да се аутентификујете код вашег Гит провајдера да бисте му одобрили приступ вашем налогу и репозиторијумима.
  5. Када то урадите, Нетлифи ће приказати листу спремишта на вашем Гит провајдеру. Изаберите Реацт пројектно спремиште које сте првобитно послали свом Гит провајдеру.
  6. Након што изаберете спремиште, потребно је да наведете како Нетлифи треба да управља процесом постављања. Обично, за статичне веб локације, не морате да уносите никакве промене, међутим, за динамичке веб локације као што су Реацт апликације, мораћете да подесите поставке израде. Срећом, Нетлифи подразумевано аутоматски детектује оквир који се користи за прављење апликације и попуњава поља потребним подешавањима за прављење.
  7. На крају, кликните Деплои сите да заврши процес.

Кликните на наведени УРЛ да бисте видели апликацију у свом претраживачу. Ако имате прилагођени УРЛ домена, можете упутити Нетлифи да га користи са вашом веб локацијом тако што ћете ажурирати УРЛ у подешавањима сајта.

Поставите помоћу функције превуци и испусти

Ово је најједноставнији метод за постављање ваше Реацт апликације на Нетлифи. Потребно је само да превучете и отпустите фасциклу за изградњу у Нетлифи-ов кориснички интерфејс за превлачење и испуштање.

  1. На контролној табли Нетлифија изаберите Сајт таб. Затим кликните на Додај нови сајт а затим изаберите Распоредите ручно из опција падајућег менија.
  2. На страници са функцијом превлачења и испуштања изаберите фасциклу која садржи датотеке Реацт изградње и испустите је у овај кориснички интерфејс. Пројекат ће се одмах поставити на Нетлифи. Алтернативно, можете кликнути на Прегледајте да бисте отпремили да изаберете фасциклу за изградњу из система датотека.

Поставите користећи Нетлифи-ов интерфејс командне линије

Користећи Нетлифи интерфејс командне линије (ЦЛИ), можете да примените своју Реацт апликацију директно са терминала. Поред тога, Нетлифи-ов ЦЛИ вам омогућава да конфигуришете континуирану примену тако да када извршите и гурате нова ажурирања у Гит спремиште, она се аутоматски примењују.

  1. Покрените наредбу испод на свом терминалу да бисте инсталирали Нетлифи-јев ЦЛИ:
    нпм инсталирај нетлифи-цли -г
  2. Сада покрените наредбу испод да бисте применили своју апликацију. Уверите се да сте у радном директоријуму пројекта пре постављања.
    нетлифи деплои
    Нетлифи ЦЛИ ће од вас затражити да му дозволите да изврши промене на вашем налогу. Након што дате дозволу, наведите назив налога тима који сте дали приликом регистрације, затим изаберите да ли да повежете директоријум апликације са постојећом веб локацијом или да креирате и конфигуришете нову један. Завршите тако што ћете навести прилагођено име веб локације и назив фасцикле за прављење.
  3. ЦЛИ ће применити радну верзију ваше апликације. Проверите да ли све ради како се очекује.
  4. Коначно, покрените наредбу у наставку да примените своју апликацију у производњу.
    нетлифи деплои --прод

Поређење три методе примене

ГитХуб метода увоза је најефикаснија за примену производних апликација јер вам омогућава повезивање ваше Гит спремиште директно на Нетлифи и одржавајте ваш код у синхронизацији са њиховом живом веб локацијом или апликацијом. Када урезујете и унесете промене у своје Гит спремиште, Нетлифи ће аутоматски ажурирати веб локацију.

Метода драг-анд-дроп је једноставнија за постављање статичних локација, јер не захтева кодирање или подешавање. Међутим, не дозвољава аутоматска ажурирања када уносите промене у своје спремиште.

ЦЛИ метод је најсвеобухватнији, јер вам даје потпуну контролу над процесом имплементације и омогућава прилагођене конфигурације. Овај метод је најприкладнији ако већ добро разумете Нетлифи и ако вам је удобно радити са командном линијом.

Све три методе су корисне за постављање апликација на Нетлифи. На крају крајева, избор који ће се користити зависиће од потреба сваког појединачног пројекта.

Коришћење Нетлифи-а за примену других апликација

Нетлифи је моћан и свестран алат који можете користити за примену других апликација које само Реацт. Можете га користити за постављање и хостовање статичких веб локација и динамичких апликација изграђених са различитим оквирима као што је Ангулар.

Интерфејс прилагођен кориснику олакшава конфигурисање, управљање и примену ваших АПИ-ја.