В этом посте я хочу поделиться опытом организации проекта в условиях 11 класса. Я думаю, этот пост может быть полезен для школьников. Если Вам больше 18 лет — скорее всего, пост большой смысловой нагрузки нести не будет.
Вот уже 2 месяца, как ведется разработка социальной сети memed. Буду краток, чтобы опять не накинули тег "Я пиарюсь". Социальная сеть, где все, что только можно, крутится на мемах. Ими можно комментировать, их можно сохранять в коллекции… Идея понятна.
Идея написать похожий проект у меня крутилась почти весь 10 класс, но я не доводил до конца. Все упиралось в то, что проект разрастался, и один я пилить и дизайн, и код, и все что только вздумается не мог. Ну просто надоедало, кончалась мотивация и я забрасывал. Но довольно сильно поднаторев в веб разработке за первую половину 2017 года, я понял, что время пришло. Время доводить до конца.
И я начал писать. 8 августа я создал проект. Надо сказать, что летом у меня был забавный режим — я ложился спать утром, ~6-10 утра, а вставал часов в 5. Никому не нравилось, но ночью мне было комфортно работать.
Стеком стал Django на сервере, для обмена данных я решил использовать JSON API спецификацию, а для фронтенда я решил использовать VueJS. Я на тот момент был знаком с ним поверхностно, но это только подстегивало интерес. Спустя неделю я понял, что влюбился в Vue.
База данных — PostgreSQL. Сервер с сайтом деплоится на Heroku. Вполне хватает — когда не пользуешься, он спит, когда ты спишь — он тоже спит, когда работаешь — он тоже работает. Но главное — бесплатный))
К 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'ы. Жизнь становится легкой, а радость заполняет сознание разработчика.
Когда-нибудь я кину ее в опенсурс, но пока мне лениво. В любом случае, когда закину, то обновлю пост. Я не скрываю ее, ни в коем случае, но как-то лень))
Поскольку я еще учусь в школе и довольно дружелюбен, то у меня много хороших друзей и товарищей, которые могут откликнуться на мои запросы.
В общем, написав в беседу класса, прекрасная Арина впряглась в проект и за интерес начала обсуждать со мной дизайн, делать макеты в фотошопе. Это было очень круто, в какой-то момент я даже не успевал за ее правками.
Вообще процесс дизайна проходил так: Арина делает макеты, кидает мне, я говорю, что в них плохо и почему(например, в мобильной версии что-то не поместится), или что цвета слишком яркие, или что-то еще, и запиливаю конечную версию на сайт.
Я запостил у себя на странице небольшую запись с ссылкой на сайт и группу, попинал друзей в лс, чтобы зарепостили и вуаля — у меня есть ~40 ребятишек, которые периодически заходят на сайт, а потом долбят меня в лс, что где-то косяк. С их помощью было обезврежено более 210 багов.
Дальше в период с середины августа до конца сентября велась активная разработка. Количество строчек кода фронтенда возросло до 16 тысяч, а бекенда до 5.
Тут важно сказать про папу. Он был крайне недоволен, что я прихожу со школы часов в 5 и до часов 12 занимаюсь проектом, говорил только о нем. Тогда мы с ним серьезно поговорили, и я сказал, что мне нужно первые 2 месяца — сентябрь и октябрь, после чего я перестану тратить на проект так много времени и начну готовиться. Немного покряхтев, он согласился. <3
Не знаю, что можно еще написать про активную разработку; наверное, я допускаю ошибку, что практически забиваю на школу в этот период времени. Стоило больше уделять внимания математике.
Как, например, сделала Арина — и у нас стало значительно меньше времени, чтобы обсуждать дизайн, но это не так страшно: я уже поймал волну и мог делать новые компоненты в стилистике старых.
Зато появился Илья, который сделал нам лого. Прости, Илья, что так долго запарывал тебя с ним!
Практически весь октябрь я занимаюсь рефакторингом кода. С 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 дней будут посвящены рекламе и работе с метриками.
Я не знаю, зачем я написал этот пост. Возможно, мне просто не с кем обсудить проект и рассказать все с самого начала. Тем не менее, вот списком мои советы тем, кто делает проекты будучи школьником:
Чао!
К сожалению, не доступен сервер mySQL