11 клас — програма модуля

Перший урок наскрізного проєкту STARTUP LAUNCH. Ти отримуєш логін і пароль до акаунта на шкільному сервері, підключаєшся до нього командою ssh і міняєш виданий пароль на власний. Потім кладеш перший файл index.html у теку ~/www/ і відкриваєш його за адресою <логін>.nstekh.uk — цю сторінку ти добудовуватимеш усі 14 уроків.

Після уроку ти

• вмієш заходити на сервер зі свого комп'ютера командою ssh і міняти там виданий пароль на власний
• вмієш відрізняти теку www/, яку бачить увесь інтернет, від теки data/, яку бачиш тільки ти
• вмієш заливати файл index.html з ноутбука на сервер по SFTP і відкривати його за своєю адресою
• вмієш рахувати в доларах, скільки коштує тримати цю сторінку онлайн — за місяць і за рік
• вмієш обирати між хостингом, VPS і хмарою й називати вголос причину свого вибору

Сервер уже є, а продукту ще немає. Сьогодні ти пишеш бриф на п'ять розділів — проблема, аудиторія, рішення, цінність, критерій успіху — і збираєш із нього файл brief.html. Заразом розбираєш ролі доступу в хмарних документах і зводиш чотири сервіси в таблицю CSV.

Після уроку ти

• вмієш писати бриф на п'ять розділів і збирати з нього файл brief.html
• вмієш видавати в панелі «Доступ» роль коментатора однокласнику й роль редактора вчителю
• вмієш діставати свій розділ з історії версій, коли його хтось переписав
• вмієш правити чужий текст у режимі пропонування, щоб автор натиснув «прийняти» або «відхилити»
• вмієш зберігати таблицю з шести колонок у форматі CSV і класти її в ~/www/data/

Речення з брифа на кшталт «конкуренти дорогі» перетворюються на числа, які можна перевірити. Ти чистиш таблицю від дублікатів, пропусків, викидів і різних написань одного слова, рахуєш формулами й підписуєш джерело кожного числа. Результат — файл data/market.csv, з якого наступного уроку ти зробиш діаграми й розрахунок прибутку.

Після уроку ти

• вмієш знаходити в таблиці дублікати, пропуски, викиди й чотири написання одного й того самого слова
• вмієш рахувати поруч AVERAGE і MEDIAN і, коли вони розійшлися більш ніж на чверть, ставити в текст обидва числа
• вмієш ставити $ у формулі так, щоб вона не ламалася при протягуванні вниз
• вмієш записувати в журнал чистки кожне рішення: що зробив, скільки рядків прибрав і чому
• вмієш здавати data/market.csv, де в кожного числа є джерело в колонці source

З чистої таблиці ти дістаєш два числа: скільки грошей лишається з одного продажу і скільки продажів треба зробити, щоб вийти в нуль. Рахуєш це формулами юніт-економіки, а витрати на сервер із уроку 1 стають рядком fixed_costs. Обидва числа й діаграму ти публікуєш сторінкою analytics.html.

Після уроку ти

• вмієш згортати сотні рядків market.csv у таблицю на кілька чисел і бачити, який сегмент приносить найбільше грошей
• вмієш рахувати, скільки гривень лишається тобі з одного продажу
• вмієш рахувати, скільки продажів треба зробити, щоб вийти в нуль, і казати, скільки це продажів на день
• вмієш обирати ціну трьома різними способами й називати причину свого вибору
• вмієш малювати діаграму просто в коді сторінки й підписувати її реченням, у якому є число

Кольори, шрифти й знак твого продукту стають файлами, а не картинками в графічному редакторі. Ти перевіряєш контраст тексту за формулою WCAG, доводиш його щонайменше до 4,5:1 і записуєш рішення у CSS-змінні в блоці :root. На виході — brand.css і assets/logo.svg, які працюють на всіх сторінках аж до Demo Day.

Після уроку ти

• вмієш дивитися на чужий макет і називати словами, що саме в ньому зроблено неохайно
• вмієш розставляти на сторінці головне, друге й третє так, щоб око знаходило їх саме в цьому порядку
• вмієш підбирати два шрифти, які працюють разом, і задавати рядку таку довжину, щоб очі не збивалися
• вмієш перевіряти числом, чи добре видно твій текст на твоєму фоні, і виправляти пару, якій не вистачає контрасту
• вмієш складати файл brand.css зі своїми кольорами й чистити logo.svg від зайвого коду редактора

Бриф, market.csv, analytics.html і brand.css збираються в одну розповідь на три хвилини. Ти розкладаєш її на вісім блоків і робиш дві форми одного змісту: документ pitch.html зі змістом і посиланнями та слайди deck.html з однією думкою на екран. Наприкінці додаєш OG-теги й картку og.png, щоб посилання в чужому чаті відкривалося з картинкою, а не голим рядком адреси.

Після уроку ти

• вмієш розповідати про свій продукт за три хвилини так, щоб чужа людина зрозуміла з першого разу
• вмієш починати розповідь із чужої проблеми, а не зі свого застосунку
• вмієш називати одне число, якому повірять, і відповідати на питання «а звідки воно?»
• вмієш скорочувати виступ із п'яти хвилин до трьох, не втрачаючи головного
• вмієш робити так, щоб посилання на твій продукт розгорталося в чужому чаті карткою з картинкою

За шість уроків ти ухвалив десятки рішень, і частина з них уже забулася. Сьогодні ти заводиш базу знань продукту: спершу як робочу базу в Notion, потім експортуєш її у теку ~/www/kb/ з вісьмома файлами .md. Кожна нотатка містить одну думку, одне джерело й front-matter із датою, тегами і статусом.

Після уроку ти

• вмієш писати нотатку, у якій одна думка й одне джерело, а не файл «про все»
• вмієш розмічати текст у Markdown: заголовки, списки, посилання, код, цитати
• вмієш додавати нотатці front-matter із дати, тегів і статусу — і знаходити в ньому помилку, через яку він не читається
• вмієш називати файли так, щоб вони відкривалися за адресою на Linux-сервері
• вмієш зібрати теку ~/www/kb/ з восьми нотаток і здати її на автоперевірку

Вісім окремих нотаток звʼязуються одна з одною. Ти розставляєш щонайменше 12 посилань [[назва]], доводиш кількість битих лінків до нуля, пишеш карту змісту kb/index.md і генеруєш із файлів .md звичайні HTML-сторінки. Після цього база знань відкривається за адресою <логін>.nstekh.uk/kb/ у будь-кого, кому ти даси посилання.

Після уроку ти

• вмієш звʼязувати нотатки так, щоб із кожної було видно сусідні за темою
• вмієш складати kb/index.md — сторінку, з якої видно всю базу за пів хвилини
• вмієш перетворювати файли .md на сторінки сайту й відкривати їх за адресою /kb/
• вмієш знаходити в базі биті посилання й нотатки, у які не веде жоден вхід
• вмієш прибирати з публічної теки те, чого чужим бачити не варто: паролі, ключі, чужі особисті дані

Ідеї перетворюються на список задач із виконавцями й датами. Ти набираєш щонайменше 25 карток без критики, групуєш їх за схожістю, розкладаєш у матрицю «цінність × зусилля» і позначаєш за MoSCoW, що робиш обовʼязково, а що не робиш зовсім. Підсумок — файл tasks.json, який наступного уроку прочитає сторінка roadmap.html.

Після уроку ти

• вмієш набрати за двадцять хвилин двадцять п'ять ідей і не зарубати жодну на льоту
• вмієш розкласти ці картки в купки за схожістю, а назви купкам дати вже після
• вмієш поставити кожну картку в матрицю «цінність × зусилля» й позначити, що робиш обовʼязково, а що не робиш зовсім
• вмієш вибрати найменшу версію продукту, якою вже можна скористатися, і відрізнити її від «усього, але наполовину»
• вмієш скласти tasks.json: дія, виконавець, дата й ознака, за якою видно, що задача готова

Список задач стає процесом. Ти ставиш собі WIP-ліміт — число задач, які дозволено тримати в роботі одночасно, пишеш Definition of Done по пунктах і ділиш задачі на три горизонти: зараз, далі й колись. Сторінка roadmap.html малює дошку в три колонки, не маючи в коді жодної назви задачі: усе вона читає з tasks.json.

Після уроку ти

• вмієш ставити собі число задач у роботі одночасно й називати причину, чому воно саме таке
• вмієш писати список умов, за яких задачу дозволено переставити в done, — по пунктах, а не «на око»
• вмієш ділити свої задачі на три горизонти: зараз, далі й колись
• вмієш верстати сторінку roadmap.html, у якій жодної назви задачі не вписано руками
• вмієш читати графік залишку роботи по днях і бачити на ньому затор

Сайт уперше починає приймати дані, а не тільки показувати їх. Ти складаєш анкету з 5–7 питань, верстаєш форму feedback.html, пишеш на сервері обробник ~/bin/form-handler і кладеш відповіді у файл ~/data/responses.csv поза вебкоренем. Далі перевіряєш командою curl, що цей файл справді не завантажується з інтернету.

Після уроку ти

• вмієш складати анкету з 5–7 питань і викидати кожне, на яке ти не зміниш свій продукт
• вмієш верстати форму feedback.html, яка відкривається за твоєю адресою
• вмієш писати на сервері маленьку програму, що приймає відповіді й дописує їх рядком у файл
• вмієш класти цей файл так, щоб його не міг завантажити перехожий з інтернету, і перевіряти це командою curl
• вмієш рахувати з відповідей середню оцінку й показувати це число на лендингу

Між приватним CSV і публічною сторінкою стає автоматичний ланцюг. Скрипт bin/report.sh читає responses.csv, рахує кількість відгуків, середню оцінку й розподіл, підставляє числа в заготовку bin/report.tpl.html і кладе готовий report.html у ~/www/. Запускає скрипт cron за розкладом, тож сторінка оновлюється без тебе — і в публічний звіт не потрапляє жодного імені чи коментаря.

Після уроку ти

• вмієш робити заготовку сторінки, у якій замість чисел стоять помітні порожні місця
• вмієш писати скрипт, який читає responses.csv і рахує з нього кількість відгуків та середню оцінку
• вмієш вирішувати, які числа можна показати всім, а які видадуть автора відгуку
• вмієш ставити скрипт на розклад сервера, щоб сторінка оновлювалася щогодини без тебе
• вмієш знаходити місце поломки за файлом-журналом, коли скрипт раптом перестав працювати

Файли, зроблені за дванадцять уроків, уперше стають однією сторінкою. Ти добудовуєш index.html до семи секцій на спільному brand.css і ставиш у нього числа, які сторінка сама забирає з market.csv, tasks.json і звіту, а не вписані руками. Паралельно розбираєш вісім ролей у команді продукту й пишеш team.html, чесно позначивши ті ролі, які виконував сам.

Після уроку ти

• вмієш розказати про вісім ролей у команді продукту: що людина в кожній ролі робить у понеділок о 9:40
• вмієш показати на своїх власних файлах, роботу якої ролі ти вже виконував
• вмієш писати заголовок сторінки, після якого за п'ять секунд зрозуміло, що це й для кого
• вмієш збирати index.html із семи секцій на спільному brand.css, без жодного мертвого посилання
• вмієш ставити на сторінку числа, які вона сама забирає з market.csv, tasks.json і звіту

Нового сьогодні нічого не будуємо. Ти проганяєш перевірки check11 1…7 разом і лагодиш те, що зламали правки останніх тижнів, перевіряєш сторінку на екрані завширшки 360 px і виступаєш із трихвилинним пітчем плюс дві хвилини питань. Друга половина оцінки — два письмові відгуки чужим командам.

Після уроку ти

• вмієш прогнати одразу всі перевірки попередніх уроків і полагодити те, що почервоніло
• вмієш перевірити свою сторінку на телефоні завширшки 360 px і виправити те, що там розʼїхалося
• вмієш розповісти про свій продукт за три хвилини так, щоб чужа людина зрозуміла, кому він потрібен
• вмієш відповісти «я не знаю, але перевірю ось так» замість того, щоб вигадувати число на місці
• вмієш написати чужій команді відгук із трьох частин: що сильне, що незрозуміле, що варто спробувати