Блог разработчицы и дачницы

Это продолжение истории о создании проекта планировщик, предыдущие части: часть 1, часть 2, часть 3, часть 4 или смотри все части в подборке После того как я реализовала список категорий и список действий, я поняла что я хочу разделять категории и как то их группировать - план уборки, план готовки, план ухода за собой. Поэтому я решила выделить еще одну сущность - планы. Так как это очередной список, то тут все оказалось довольно просто в реализации. С помощью миграции я добавила таблицу plans, потом в таблицу categories я добавила еще одну колонку - plan_id...

Это продолжение истории о создании проекта планировщик, предыдущие части: часть 1, часть 2, часть 3, часть 4 или смотри все части в подборке Начинаю с БД - а именно написание миграции для создания таблицы По столбцам таблицы все очень похоже на таблицу категорий, только тут добавляется еще одно поле - id категории, которой принадлежит действие. В сервисе добавляю все необходимые функции для работы с БД - поиск, создание, добавление и редактирование На этом все, бекенд готов! На фронте что-то аналогичное...

Все случилось в 2021 году. Мы уже купили квартиру в ипотеку и сменили наши 17 кв.м. на 64 кв.м. Отдельная комната для нас с мужем, отдельная кухня, детская, большой коридор. И конечно же уже размеры дачного домика казались маленькими для нас. В июне 2020 года мы купили машину в кредит. Но это отдельная история. В июле 2021 года я рефинансировала ипотеку и подумала про рефинансировании кредита на машину, потому что не хотелось оформлять КАСКО в 150 тысяч на машину, из-за моих свеженьких прав, да и в 80 тысяч тоже не очень хотелось, а без этого наш кредит бы вырос значительно...

На одном из проектов по работе (проект был для банковской сферы, не в открытом доступе) мы делали элемент для ввода периода. Но заказчика не устраивал тот компонент который мы взяли разработку airbnb/react-dates (сейчас этот пакет уже не относится к airbnb и перестал развиваться). Ему не нравился формат ввода даты и времени вручную, нужно было прописывать все знаки - точки, двоеточие вручную. И я сделала компонент для ввода даты и времени по формату дд.мм.гггг чч:мм с использование компонента react-input-mask (к сожалению проект тоже не обновляется)...

Нас было трое - я, муж и маленькая дочка. Жили мы в маленькой квартире в 17 кв.м. Мой муж любил ездить на рыбалку, вставал рано утром, ехал на реку - Обь, Томь или еще куда то, но чаще на Обь. Пока не было детей он брал меня с собой. Когда появилась дочь с этим стало сложнее, так как с ребенком на руках быть на природе тяжело. Я не помню точно как у меня появилась эта мысль, возможно после очередной поездки на дачу к моей маме. Но точно помню что я говорила мужу - "давай купим дачу рядом с рекой, чтобы ты ходил на рыбалку а я буду заниматься огородом"...

В субботу утром мы приехали на дачу с озера. После небольшого отдыха я пошла готовить еду. Очень торопилась, потому что натягивало тучи и уже начинало понемногу капать. Я приготовила рис и салат, муж пожарил котлеты и сосиски на костре. Мы сели всей семьей обедать, включили мультфильм "Добрыня Никитыч и Змей Горыныч". Дождь уже был сильный, по крыше стучало так, что пришлось колонки делать на полную громкость чтобы услышать что-то. Свет моргнул первый раз. Колонки, монитор и роутер выключились. Все включили обратно и продолжили просмотр...

В этой статье я опишу то как я реализовала все необходимое для отображения, добавления и удаления категорий. Это продолжение истории о создании проекта планировщик, предыдущие части: часть 1, часть 2, часть 3 Для проекта я выбрала БД Postgre, чтобы подключаться и получать данные из таблиц я использовала библиотеку pg. А также библиотеку node-pg-migrate для миграций - чтобы одной командой поддерживать актуальное состояние БД. Все запросы к базе данных происходят через единую точку входа - db/index...

10 июля начался мой отпуск и пока не было ни одного дня за эту неделю. чтобы мы сидели в одном месте. Пятница (7) (последний рабочий день) - поехала к себе на огород Суббота (8) - поехали с мужем на дачу к маме ставить бассейн, потом домой Воскресенье (9) - поехали на дачу Понедельник (10) - поехали домой, заказывать окна Вторник (11) - поехали на дачу Среда (12) - поехали на гидронамыв (озеро рядом с Обью) покататься на лодке. Но в итоге только покупались, потому что не взяли весла Четверг (13)...

Это продолжение истории о создании проекта планировщик, предыдущие части: часть 1, часть 2 Я начала с реализации списка категорий и сделала статичный список, об этом я писала в предыдущей истории. Следующим шагом было отображение этого списка на фронтенде. Я подключила к фронтенду библиотеку appolo, с помощью которой можно достаточно просто делать запросы к бекенду, написанному на GraphQL. А для начала опишу как будут хранится файлы в проекте фронтенда: Весь основной код будет располагаться в каталоге src...

В предыдущей статье я описала почему я хочу писать свой web сайт для планирования. Но есть еще и другая причина - это изучение тех технологий, которые хотелось бы изучать, но на работе они не используются. Мой проект будет состоять из двух частей - фронтенд и бекенд. У меня был опыт создания фронтовых проектов с нуля, а вот с бекендом - нет. Итак, что же я выбрала для написания проекта. Начну с фронтовой более привычной для меня среды в последние годы: React, TypeScript, Webpack, Babel, Prettier, Eslint, Material UI, SASS, Apollo...