Бонжурики!

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

Немного о memed

Вот уже 2 месяца, как ведется разработка социальной сети memed ^[1]. Буду краток, чтобы опять не накинули тег "Я пиарюсь". Социальная сеть, где все, что только можно, крутится на мемах. Ими можно комментировать, их можно сохранять в коллекции… Идея понятна.

Начало

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

И я начал писать. 8 августа я создал проект. Надо сказать, что летом у меня был забавный режим — я ложился спать утром, ~6-10 утра, а вставал часов в 5. Никому не нравилось, но ночью мне было комфортно работать.

Стеком стал Django на сервере, для обмена данных я решил использовать JSON API ^[2] спецификацию, а для фронтенда я решил использовать VueJS. Я на тот момент был знаком с ним поверхностно, но это только подстегивало интерес. Спустя неделю я понял, что влюбился в Vue.

База данных — PostgreSQL. Сервер с сайтом деплоится на Heroku ^[3]. Вполне хватает — когда не пользуешься, он спит, когда ты спишь — он тоже спит, когда работаешь — он тоже работает. Но главное — бесплатный))

К 12 августа я набросал каркас сайта — базовый функционал, аля авторизация, постинг, рейтинг. Кстати авторизацию я стал использовать через VK Open API. Я очень не люблю хранить пароли и вам не советую.

Так вот, я запилил крутую библиотеку размером в 350 строчек, которая позволяла бы мне удобно экпозить нужные поля, настраивать доступы и все такое.

class MessageSerializer(Serializer):
    model = Message
    name = Message.type()

    def item_attributes(self, item):
        requester = resolve_user(self.request)
        if requester is None or item.dialog.participants.filter(id=requester.id).first() is None:
            raise PermissionDenied
        default_attributes = self.resolve_keys(item, ['text'])
        default_attributes["timestamp"] = item.timestamp.timestamp()
        return default_attributes

    @staticmethod
    def relationships_provider():
        return {
            'dialog': lambda item: item.dialog,
            'author': lambda item: item.author,
            'post_attachments': lambda item: item.post_attachments.all(),
        }

class MessageRoute(ModelRoute):
    model = Message
    name = Message.type()

    items_per_page = 50
    serializer_class = MessageSerializer

    def custom_endpoints(self):
        return [
            Endpoint("^$", "GET", lambda request: HttpResponseForbidden())
        ]

Вот пример ее использования. Мы реализуем 2 класса — Serializer и ModelRoute.
В первом мы описываем, какие поля и когда мы можем всовывать в ответ, а во втором — добавляем свои endpoint'ы. Жизнь становится легкой, а радость заполняет сознание разработчика.

Когда-нибудь я кину ее в опенсурс, но пока мне лениво. В любом случае, когда закину, то обновлю пост. Я не скрываю ее, ни в коем случае, но как-то лень))

Привлечение друзей

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

В общем, написав в беседу класса, прекрасная Арина ^[4] впряглась в проект и за интерес начала обсуждать со мной дизайн, делать макеты в фотошопе. Это было очень круто, в какой-то момент я даже не успевал за ее правками.

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

Тут я понял, что могу использовать силу друзей для того, чтобы набрать аудиторию альфа тестеров.

Я запостил у себя на странице небольшую запись с ссылкой на сайт и группу, попинал друзей в лс, чтобы зарепостили и вуаля — у меня есть ~40 ребятишек, которые периодически заходят на сайт, а потом долбят меня в лс, что где-то косяк. С их помощью было обезврежено более 210 багов.

Активная разработка

Дальше в период с середины августа до конца сентября велась активная разработка. Количество строчек кода фронтенда возросло до 16 тысяч, а бекенда до 5.

Тут важно сказать про папу. Он был крайне недоволен, что я прихожу со школы часов в 5 и до часов 12 занимаюсь проектом, говорил только о нем. Тогда мы с ним серьезно поговорили, и я сказал, что мне нужно первые 2 месяца — сентябрь и октябрь, после чего я перестану тратить на проект так много времени и начну готовиться. Немного покряхтев, он согласился. <3

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

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

Зато появился Илья ^[5], который сделал нам лого. Прости, Илья, что так долго запарывал тебя с ним!

Рефакторинг

Практически весь октябрь я занимаюсь рефакторингом кода. С 16к строк фронтенда снизил до 13, бекенд практически не уменьшился — рукописная библиотека работала на славу.

Из некоторых примеров рефакторинга:

1) Оказывается, что делать блоки — компоненты Vue удобнее, чем делать блоки — html + общие css свойства. То есть вместо

<div class="block-container" >
...content...
</div>

Получается

<BlockContainer>
....content....
</BlockContainer>

Это удобнее по нескольким причинам, например, лучше смотрится в Vue dev tools дереве компонентов. Еще — править конкретный блок, где находится html, scss, js удобнее, чем искать нужный _block-container.scss и там что-то править. Когда все находится на одном экране, контекст не теряется, а вместе с ним и время.

2) Vuex. Я долго не хотел его добавлять, потому что очень не хотелось переделывать с локальных states на глобальные, но попробовав, сразу понял, что это круто. Кеширование — сила. Например, мне не нужно запрашивать с сервера /user/me каждый раз, когда нужно проверить, имею я права на изменения сообщества, своего профиля или чего либо. Или мне не нужно обновлять каждый раз мои "сообщества", если я уже из загрузил. В общем, Vuex — класс.

Конец разработки

Я планирую закончить активную разработку и рефакторинг к 20 октября. Последние 10 дней будут посвящены рекламе и работе с метриками.

Заключение

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

1. Разумно распределяйте свое время. Не стоит уходить в крайности и прогуливать школу, чтобы больше времени тратить на проект. У Вас сейчас много времени, особенно если Вы еще не в 11 классе.
2. Используйте человеческие ресурсы, которые находятся рядом с Вами. Не стоит рассчитывать, что человек, которого Вы просите помочь, согласится и будет тратить столько же времени, сколько и Вы. Постарайтесь обговорить сразу, сколько времени вы готовы тратить на проект, чтобы потом не было сюрпризов. При общении с друзьями — сотрудниками старайтесь откидывать шутки, trashtalk и не отвлекаться. Если вы хотели в это время заниматься проектом, им и занимайтесь.
3. Ставьте реальные сроки. Изначально я думал, что к 1 сентября будет готов почти весь проект, но как оказалось, с 1 сентября я добавил 30% функционала. Когда срок обозначен, не стоит начинать заниматься 1234132432 часов в день. Если Вы регулярно уделяете проекту несколько часов, это уже продуктивнее.
4. Спите нормально. У меня есть небольшой сдвиг — если между тем, как я закончил работать и сном проходит меньше часа, то я не могу уснуть ни в какую. В голове куча мыслей, идей, возможных реализаций. Приходится считать овечек (не шучу), пока не успокоюсь. А еще — не стоит брать телефон в руки, когда ложишься спать. Гарантированные потерянные часы сна))

Чао!

Автор: enchantinggg

Источник ^[6]