Є такий ресурс - Хабр. І на ньому розмістили статтю “Теперь я не могу сделать даже маленький сайт”
У більшій-мірі, я рознесу цю статтю й опишу як не стикатись із подібними проблемами. Короткий вступ. Колись чувак писав сайт, потім армія, а тепер знову захотів відновити свій пет-проджект. А технології розвиваються. Php, react, vue, docker. Йому підгоріло і понеслось …

Вибираємо мову програмування

Хм, не могу же я просто взять PHP и написать на нем несколько страничек вперемешку с HTML. Как я буду это поддерживать без ООП и вообще нормального разделения кода? К тому же, все говорят, что PHP уже не очень, да и сколько новых версий вышло! Наверно, мне нужно взять что-то более современное, Node.js или Python.

Ну ясно що не можеш взяти РНР бо ти не шариш :D. Чувак не розуміє які у нього критерії до вебсайту і вважає що йому треба брати щось складне або новомодне. Якщо ви у такій самій ситуації - задайте собі ряд запитань для того що б визначитись з мовою.

  • На якій мові я зможу швидко підняти сайт?
  • Вебсайт витримає навантаження на вибраній мові протягом року (хз, період виберіть самі, але не плекайте надій на миттєвий ріст трафіку)

Тут все просто. Прийшов, побачив, написав. Пиши на на тій мові, яку знаєш. Немає сенсу брати технологію в якій не розбираєшся на першому етапі. Це при умові що ви бажаєте вирішити проблему.

Определившись, что я буду использовать или Python, или Node.js, я понял, что просто так отдавать целые странички с сервера нехорошо.

Звідки він це пойняв. І чому “не харашо”.

Дорогий читач, ти взагалі в курсі що в кривавому ентерпрайзі (з багатомільйонними оборотами) може бути рнр який із бекенда видає повністю готові сторінки. Це не супер-дупер і скоріш за все легасі - але камон, ця штука приносить бабло. І поки не буде потреби його переписувати - хай крутиться і заробляє вічнозелені. Але ні, в чувака це не спрацює.

Не потрібно ускладнювати собі життя. Для розв’язання проблем вибирайте знайомі вам технології!

На фронтенде мне стоит подключить Axios, хотя теперь есть Fetch, но поддерживается ли он всеми браузерами? А может быть мне вообще использовать Svelte, чтобы заодно научиться чему-то новому?!

Ось тут і зарита собака. Є 2 шляхи. Ви хочете вивчити щось нове, чи вирішити задачу? Якщо і те й інше тоді беріть нові технології й не нийте. Але в такому випадку будьте готові що у вас може прогоріти все. Краще затягніть 1ну нову технологію і вивчайте її. Тоді малими кроками ви зможете добитись певних результатів.

Вам вчитись потрібно чи зробити сайт якісно і швидко? Задавайте собі це запитання перед тим як приступите до вибору технологій.

Tooling

Теперь стоит правильно настроить IDE, для того, чтобы соблюдать Code Styles

От нафіга? Кому треба цей кодстайл. Юзайте дефолтний, або заюзайте популярний стандарт. Кому яка різниця чи є у вас після дужки пробіл чи ні. Необхідно думати про проблеми які ви хочете вирішити, а не про кодстайл який взагалі нікому не цікавий.

Разобравшись, я понимаю, что мой код нужно где-то хранить. Так как я уже порядком устал, выберу популярнейший GitHub. Настроив Git и авторизацию через ssh на моем компьютере, я понимаю, что я не знаю, какую систему ветвления использовать. GitFlow слишком избыточна, пока я один, но не коммитить же все в мастер-ветку? Мало ли к проекту кто-то присоединится, или, если я покажу репозиторий на собеседовании, все будут смеяться. Остаётся и непраздный вопрос, что писать в описаниях коммитов и на каком языке, но оставим это на потом.

Ну без гіта нікуди. Тут +1. Але заради вашої цікавості зробіть заміри скільки часу іде на налаштування.

  • Крок 1. В GitHub створюємо репозиторій (ну максимум 2 хвилини якщо ви не знаєте де клацати)
  • Крок 2. Копіюєте команди типу git clone/git init і все. У вас є git і пушайте туди все що душа забажає.

Автор оригінальної статті каже що не можна комітити в мастер і треба думати про якісь там флов. У мене є 9 проектів (або більше :D) у яких я комічу в мастер. Коли туди залітає код - я просто кайфую, бо у мене +1 локейшин де знаходяться дані. І нічого, 5 років політ нормальний.

если я покажу репозиторий на собеседовании

Типу чуваки будуть розбиратись як ви називали гілки і яка у вас методологія. Всім по-бабану. Також необхідно визначитись для чого показувати цю штуку на співбесіді.

Проблема ця що і вище - не зрозуміла ціль. Якщо ви хочете показувати код на співбесіді - тоді вам потрібно буде пройти тернистий шлях інженера, що б з першого разу написати код за який не стидно. А якщо ви джуніор, після перших 100 рядків коду вам буде самому страшно на цей код дивитись, не кажучи уже про сурових інтерв’юерів які розносять співбесідника у пух і прах.

Писати код це не лайки у Фейсбуці ставити, тут думати потрібно. Це тернистий шлях сповнений безліччю перепон. Памятайте про це. Не вішайте носа, вчіться, пишіть код і радійте кожному скомпільованому рядку.

Deployment

Стоит подумать, как это все дело развернуть на хостинге. Если бек на Python, то нужно создать виртуальное окружение и работать в нем. Почему-то на сервере сходу это не получается, что-то вечно падает. Кстати, нужно запускать приложение как сервис, чтобы всё перезапускалось после падения! Всё, теперь точно берём Ноду!

Кек. Ще кубернетіс туди затягни що б 3 сторінки віддати. Це класичний приклад оверінжінірінгу. Якщо вам потрібний прости сайт - купіть хостинг на якому все є: nginx, mysql, php. Залив код і все працює. Якщо, десь в якісь паралельній вселеній хтось дізнається про ваш сайт і у вас буде 2тисячі відвідувачів за день аж тоді ви зможете подумати про переїзд на якусь іншу інфраструктуру типу digital ocean, aws, google cloud … До цього моменту це не потрібно.

Оцініть проект тверезо. У вас є метрики які підтверджують великі навантаження, або складність алгоритмів які мають виконуватись? На основі цих даних ви зможете подумати що вам треба і продумати стратегію.

Pre end

Ещё я не подумал, конечно, о TS, ES6, SASS, PUG, GraphQL, ООП, функциональном программировании, иммутабельности и обо всём таком. И нужно будет сертификат HTTPS прикрутить обязательно! Может, мне позвать в команду пару друзей, чтобы сделать всё правильно вместе? Тогда без Scrum и Pull Requests не обойтись.

GraphQL саме те що треба. Є проста формула: чим більше технологій ви стараєтесь вивчити тим менше технологій ви освоїте.

На этой ноте я устал окончательно и подумал, что, может, мне стоит откопать старую книжку по PHP, и сделать всё, как в 2013 году, когда я ни о чём выше не имел представления, а половина технологий ещё не появилась? Похоже, я слишком много думаю наперёд. Решу всё это потом, сейчас посмотрю сериал и пойду спать, а завтра точно начну программировать.

Треба просто почати писати і не задумуватись дуже сильно. За цей час, поки роздумували про проблеми, можна було б уже запустити сайт на якійсь CMS (або фреймворку) і продумувати структуру таблиць на оснвоі наших даних.

Для того що б добиватись успіху вам варто мати якісь маленькі перемоги. Бажано що б ці перемоги були у вигляді певних артефактів: задачі, таблиці порівняння певних технологій, але оптимально це код.

The end. My story.

Одного разу у мого дружбана народився син. І коли діти малі, записують час коли вони їдять, ідуть спати, коли встають і інші відмітки про події. Ідея дуже проста. Спочатку я подумав що можна заюзати щось уже готове. Ось декілька пунктів які вказують чому готові рішення не підійшли:

  • Записувати в екселі не фонтан, інтерфейс складний для простої задачки.
  • Хороших аплікух без реклами не було (це було досить давно, можливо зараз щось є).
  • У молодих батьків дуже, ну дууууже напружені перші тижні. І буває таке, що ти не знаєш взагалі чи спав сам, не кажучи про мале чадо. Інтерфейс мав буте супер простий.

Я вирішив допомогти написавши просту веб-сторінку (зараз на це кажуть SPA на який можна було б це все робити. Технології:

  • javascript - не варто нічого компілювати, працює майже всюди. Не потребує бекенду.
  • dropbox - тут будуть зберігатись дані. Авторизація по OAuth, даєш доступ на створення збереження даних і все готово.
  • MaterializeCSS - простий css фреймворк який задовільняє мінімальні вимоги.
  • GitGub pages - мій хостинг. Нічого взагалі від мене не треба. Залив код - все працює. Назва домену не критична.

Тоді я написав javascript код який працював з Dropbox SDK. Працювало це все дуже просто. Заходиш на сторінку - авторизуєшся через dropbox auth. Дальше підтягуються дані з дропбоксу і показуються у вигляді таблиці. Різні типи записів - містили різні іконки. Коли жмеш на якусь кнопку виконується функція add

1
2
3
4
5
6
7
// Table - інстанс обєкту таблиці із DropboxSDK
var add = function (type) {
  table.insert({
    type: type,
    time: (new Date()).toString(),
  });
}

Це я тепер шарю що функція add impure і можна багато що удосконалити. Але це був 2015 рік і я тоді не був такий прошариний. Але код працював і вирішував проблеми. Що ще потрібно? На всю цю двіжуху я потратив декілька годин. Мені дуже подобалось що dropbox sdk, materialize можна було підтягнути з cdn. Ніяких npm install. Якщо у 2020 або дальше потрібно буде розв’язувати подібну проблему - я піду цим самим шляхом і навіть не буду роздумувати про всякі дрібниці типу code style (як мінімум до 100го коміту).

Суть історії в тому що ви можете швидко написати те що потрібно якщо у вас є вимоги та продумана стратегія.