Руководство для разработчиков

Вы хотите что-то сделать, но вы застряли. Вы либо не знаете, что делать, либо просто не знаете, как это сделать.

Я знаю это чувство.

Что вам нужно, так это основа того, как начать работу — начать движения и продвигаться к завершению первого MVP. Вот краткое руководство, которое поможет вам начать работу и материализовать свое приложение.

Идея

Идея является отправной точкой для каждого приложения. Но часто мы застреваем, пытаясь найти идеальную идею.

Обычно это убийца идей. Почему? Потому что это заставляет нас отвергать все, что мы можем придумать. Мы говорим себе, что это глупо или слишком упрощенно.

Но иногда лучшие идеи не обязательно должны быть оригинальными — просто нужно уметь делать это вещь лучше, чем это делают другие.

Что это решает?

Придумывая идею, вместо того, чтобы пытаться разработать следующее многомиллиардное приложение, задайте себе простой вопрос: что это решает?

Или, если вы совершенно ничего не понимаете, сделайте еще один шаг назад и спросите себя: что еще нужно решить?

Когда дело доходит до приложений выходного дня, вам нужно искать наименьшее неудобство для вашего цифрового существования и найти способ попытаться решить эту проблему.

После того, как вы выбрали проблему и нашли решение, вам нужно уточнить функции, задав вопрос: действительно ли мне это нужно?

Это важно, потому что помните — у вас есть только выходные, чтобы завершить свое приложение. Это не так много времени, если вы обнаружите, что возитесь с функциями и функциями, которые являются краеугольным камнем существования вашего приложения.

Так работает MVP. Дополнительные функции могут быть реализованы в другие выходные. Это первые выходные — так что вам просто нужно работающее приложение с основными функциями, которое решает вашу проблему.

Грубый эскиз с xTiles

Если вы еще не знаете, как быстро загружать прототипы, попытка набросать их в Figma может занять все ваши выходные.

Хотя метод с ручкой и бумагой работает очень хорошо, он по-прежнему оставляет нам много места для отвлечения, когда дело доходит до фактической части здания.

Лично я использую xTiles в качестве приложения для быстрого прототипирования. Как?

Вот как я это делаю.

Шаг 1.Выберите фреймворк, похожий на CSS bootstrap. (Я использую смесь Chakra UI и Bulma, в зависимости от проекта)

Шаг 2. Делайте скриншоты различных элементов платформы, если это необходимо.

Шаг 3.Вставьте в xTiles и переместите его по мере необходимости, чтобы сшить грубый контур интерфейса.

Кроме того, вы можете выбрать фрагменты Интернета, которые вам нравятся (или другие приложения), и объединить решение, которое вам подходит. Конечный продукт, вероятно, будет выглядеть немного иначе, но общая суть основных функций и макета даст вам преимущество.

Вот полноэкранный снимок темы, которую я собрал для проекта выходного дня, над которым работал несколько недель назад. Вот ссылка на xTiles, чтобы увидеть его во всей красе.

Преимущество такого подхода в том, что он сообщает мне, какие визуальные компоненты легко доступны, а какие мне нужно сделать на заказ. Это также дает мне общее представление о том, как будет выглядеть мое приложение, куда все пойдет и как будут работать потоки пользовательского интерфейса.

Это также полезно для структурирования кода, и вы не просто добавляете что-то по ходу дела.

Рамки

Как разработчики, у всех нас есть свои предпочтительные стеки. Однако не все являются полноценными разработчиками, и это нормально. Для таких вещей есть обходные пути, особенно если вы, как и я, сильно увлекаетесь интерфейсом 😅

Вот стек технологий, который я обычно использую для своих приложений выходного дня.

Внешний интерфейс

Сейчас я использую Next.js. Отчасти это в основном React на стороне сервера. Это означает, что данные обрабатываются на сервере и отправляются в виде полностью обработанных HTML-страниц.

В дополнение к этому вы также можете создавать API-интерфейсы в своем проекте, и ваше приложение может беспрепятственно взаимодействовать с ним без необходимости дополнительных внешних функций и настроек. Все упаковано в одном пространстве.

Бэкенд

В какой-то момент вам понадобится хранить данные и управлять пользователями. Supabase — хороший вариант и имеет приличный бесплатный уровень, который отлично подходит для приложений выходного дня.

Это похоже на Firebase, но с ним немного легче мысленно иметь дело, потому что это SQL. Проблема, которую я обнаружил с Firebase, заключается в том, что все это проприетарно. Ваши данные и база данных застряли в Firebase. Supabase — это PostgresSQL с открытым исходным кодом, который имеет множество функций, к которым легко подключиться.

Инфраструктура

Если вы не являетесь экспертом по развертыванию облака, инфраструктура может показаться сложной задачей. Vercel — это хорошее и простое в использовании решение, которое предполагает подключение к вашему репозиторию GitHub.

Как это работает? Каждый раз, когда вы отправляете данные в подключенный репозиторий GitHub, Vercel будет создавать и развертывать ваше приложение. Если вы используете Next.js, то это включает в себя все ваши API и удваивается как ваши серверные функции.

Просто обратите внимание, что это не включает управление базой данных (которое уже описано, если вы используете Supabase).

Осталось только быстро создать приложение, развернуть его и убедиться, что все работает.

Запуск в первые выходные

Вы сделали приложение. Вы успели за выходные. Пришло время отпраздновать. Распространение информации может показаться пугающим, но это не обязательно.

Вот где красота приложения выходного дня проявляется.

Вам разрешено говорить людям, что вы сделали это за выходные. Что это делает?

Во-первых, это дает вам разрешение быть несовершенным. Часто мы слишком зацикливаемся на создании идеального приложения, игнорируя путь к нему.

Рим строился не за один день. Идеальное приложение не создается за выходные.

Суть в том, что основы уже заложены, и то, что вы будете делать в следующие выходные, зависит только от вас. Опирайтесь на это. Снеси его. Настройте это. Почини это. Все, что вы делаете с ним, можно рассматривать как обновление прогресса.

Бесплатный шаблон и рабочий лист

Все любят халяву, так что вот добыча этой недели.

😃📌 xTiles [template] Weekend App

Чтобы получить копию, нажмите на три точки и Duplicate document .