Горящий фронтендер
102 subscribers
65 photos
3 videos
83 links
Погромист переднего края. Нихуя не работает! Фронтенд проклят! Мы все умрем!

Бложик: https://dskr.dev
Tg: @dskrylnikov
Канал с фоточками: @dskr_pic
Тви: https://twitter.com/dskr_dev
Download Telegram
Немного нестандартного использования технологий во фронтенде.
Решили мы интерфейс между node.js и беком поменять. И бек решил что реализовывать кучу кастомных штук с настройками не правильно, и вместо этого в некоторых местах запроса можно передавать вот прям функции.
Функции имеют ограниченный синтаксис с самыми необходимыми функциями: and, or, eq, gt, lt и т.д.
А выглядит это дело как-то так:
Но, писать кучу буковок в json формате немного лениво. И показалось что это можно оптимизировать.
Первое что пришло в голову это использовать jison. Тем более что такой опыт уже был.
jison это bison на js.
А bison это парсер для грамматики. Грамматику можно описать примерно любую.
Но есть один минус, грамматику там нужно описывать на специальном языке. А разбираться в нём мне лениво, да и поддерживать потом это дело сложно. Вот пример калькулятора: https://github.com/zaach/jison/blob/master/examples/calculator.jison
И тут я вспомнил про jsx. В нём можно описать такие штуки достаточно просто. Правда у jsx есть небольшой минус, его нужно транспилировать. И хотя нода и так написана на ts, а значит уже транспилируется, добавлять ещё и jsx туда не хочется.
Плюс будут сложности если захочется реализовать несколько разных языков.
Но у jsx есть клёвая альтернатива. Это HTM. Транспиляция не нужна так как используются шаблонные литералы. А остальной синтаксис очень похож на jsx.
Реализация функции h() функции для пары функций будет выглядеть как-то так.
Конечно надо бы ещё всяких проверок добавить, но это уже рабочая штука
А вот так будет выглядеть использование
Ну и так как htm похож на jsx, можно писать что-то такое
Как не пугая фронтендеров предложить им использовать монады?
Ну, можно просто не говорить что это монада)
В issues даже жалуются что по слову монада, её на гитхабе не найти)
Что такое монада?
В комменатриях спрашивают: «А что такое эти ваши монады?»

Всем конечно же известо что монада - это моноид в категории эндофункторов 🙃

Если совсем просто, монада - это контейнер с парой определённых методов.
Монад есть несколько разных видов. Если мы говорим об адекватном программировании, а не о фп извращениях типо хаскеля или скалы, то чаще всего используют монады Maybe, Either и Task. Называться они могут по другому, например Option, Result и Future.

Maybe либо содержит в себе результат, либо нет. Нужна она чтоб у нас не возникало проблем типо undefined is not a function.

Either либо содержит результат, либо ошибку. Нужна она чтоб не бросать исключения по каждому чиху.

Task нужно для выполнения асинхронных действий. У фронтендеров есть Promise, это плохая породия на Task, но в целом можно и с ним жить.

На самом деле в фп есть не только монады. Кроме них есть функторы и аппликативы. И всё это дело собирается в матрёшку.
Функтор - это контейнер у которого есть метод map. Map это функция которая как-то изменяет значения в контейнере.
Аппликатив - это функтор у которого есть метод ap. Ap позволяет вставить функцию внутрь контейнера, чтоб потом её можно было применить к нескольким контейнерам(в реальной жизни это примерно никогда не нужно, если вы конечно не захотите написать свою реализацию монад)
Монада - это аппликатив у которого есть метод chain. Chain позволяет взять значения из двух контейнеров, что-то с ними сделать и получить новый контейнер.

Там на самом деле всё немного сложнее, но в общих чертах так. А ещё ко всему этому применяется теория категорий(понятия не имею что это такое), но ходют слухи что оно вот прям на математическом уровне может доказать что все вычисления сходятся по типам, и никаких ошибок в рантайме быть не может.

Если вдруг всё равно нияего не понятно, есть клёвая статья с красивыми картинками: Функторы, аппликативные функторы и монады в картинках

Если хочется чуть глубже погрузится в фп в контексте фронтенда есть клёвая книга: Mostly adequate guide to FP (in javascript)
И перевод её на русский язык: Mostly adequate guide to FP (in javascript, translated to russian)

Если не понятно, а как в реальности то эти ваши монады могут помочь фронтендеру есть крутой доклад про обработку ошибок: Дмитрий Махнёв Артём Кобзарь — (не|ну)жная монада Either на практике и в теории

И эти же авторы написали достаточно удобную реализацию монад Either и Maybe для js: @sweet-monads

А если вы вдруг совсем упоролись и хотите писать на TS как на хаскеле, то есть прекрасная библиотека: fp-ts
Please open Telegram to view this post
VIEW IN TELEGRAM
👍3
Сегодняшний день я потратил на сражение с 👩‍💻 S3.

S3 это протокол и амазоновский сервис для хранения файлов. Кроме амазона его юзают примерно все.

Вот и у нас тоже стоит селфхостед что-то(я даже не знаю что) умеющее в s3. Один из продуктов его использует и там всё ок. Нужно было добавить всё то-же самое во второй продукт. Казалось бы всё просто, скопировал код прослойки, добавил нужные вызовы и готово. Но тут начались странности. Бакет создаётся нормально, а значит с адресом/аутентификацией проблем нет. Но записать туда файл не выходит. При этом ошибка максимально странная. getaddrinfo ENOTFOUND. Какого-то чёрта амазон решил что будёт клёвой идеей в качестве эндпоинта юзать имя_бакета.хост/
И конечно же это не работает если у тебя селфхостед s3.
Но как же этот код работал в другом продукте? По случайности там в имени бакета используется нижнее подчёркивание.

Ебучий амазон 🖕 Ебучие неочевидные дефолты 🤮 Никогда так не делайте.

Проблема решилась добавлением в конфиг флага forcePathStyle.
Please open Telegram to view this post
VIEW IN TELEGRAM
👍41🔥1
Вдруг кому делать нечего. Тут начался декабрь, а значит и новый #adventofcode

Первый день совсем простой. Особенно если писать на чём-то высокоуровневом)

https://adventofcode.com/2022
🔥2
Live stream finished (1 hour)
Пробовал сегодня постримить решение AoC. В целом схема рабочая, но меня подвел obs, в какой-то момент завис захват экрана(
Если будет не лень, завтра повторю попытку.
Запись доступна на ютубе, но учитывая что большую часть времени там зависший экран, смотреть не рекомендую)
https://youtu.be/qNLEyPCLHP4
Продолжил стримить AoC. В этот раз задача была простой, я не тупил и обс не тормозил. Поэтому справился меньше чем за 30 минут.
Единственная сложность задачи это распарсить входные данные. Ну и да, GitHub Copilot здорово помогает)

https://youtu.be/-4c2EdhvnyM
3
Продолжаю решать AoC. День 7. И судя по инпуту там что-то страшное. Начну минут через 5.

https://www.youtube.com/watch?v=VfJOByXNXuM
Второй день подряд горит 🔥 из-за проблемы с производительностью. Дошел до того что на две окружение всё летает, а в проде любой запрос выполняется по несколько десятков секунд. Если я это пофикшу, напишу детективную историю 🍵
Please open Telegram to view this post
VIEW IN TELEGRAM
❤‍🔥2🔥1
Всего полтора месяца осталось до выхода TypeScript👩‍💻 5.0
Релиз мажорный потому что добавили долгожданные декораторы. И да, это те самые настоящие EcmaScript декораторы. Из клёвых фич ещё добавили const тайп параметры. Теперь при правильной типизации не придётся вечно писать as const.
Уже сейчас доступна бета
https://devblogs.microsoft.com/typescript/announcing-typescript-5-0-beta/
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥1