layout | title | lang | permalink |
---|---|---|---|
page |
О сайте |
ru |
ru/about/ |
Web Dev Tips - это сборник советов и рецептов по веб-разработке (в основном по фронтенду) и настройке пк под себя, которые в какой-то момент мне помогли и которые я собрал в базу знаний, чтобы не забыть. Возможно они пригодятся и вам!
Хочу подчеркнуть, что это не энциклопедия. Для получения обширных базовых знаний стоит обратиться к MDN, javascript.info или Доке. Часть заметок здесь взята из подобных сайтов, но в основном Web Dev Tips - это вещи, которые можно узнать только из практики. Частично из моей собственной, частично из stackoverflow, блогов и остального веба.
Кстати, о разных источниках информации по фронтенду вы можете узнать из моей подборки.
Еще один дисклеймер: любым советам здесь вы следуете на свой страх и риск. Некоторые из них могут не работать у вас или работать не так.
Слева в боковой панели вы найдете все заметки, разделенные по нескольким общим рубрикам.
В шапке есть поиск по всем заметкам (ищет по заголовкам, тегам и содержимому).
Справа панель с тегами. У каждой заметки может быть множество тегов, то есть тем, которые она затрагивает.
Эти заметки из моей личной практики и лишь малая толика того, что может понадобиться в разработке. Вы можете помочь сделать эту подборку гораздо универсальнее и полезнее!
Сайт Web Dev Tips сделан на Jekyll. Если захотите собрать его у себя полностью, то учтите, что он сделан на базе ruby 2.7.6. Если у вас другая версия, используйте менеджер версий ruby rbenv или rvm.
Но чтобы поучаствовать вам не обязательно что-то устанавливать и собирать. Достаточно отредактировать заметку прямо здесь на гитхабе или создать новую. Для редактирования нажмите на ссылку "Edit on GitHub!", которая есть на каждой странице сайта. Все заметки - это файлы в формате markdown.
Имя файла обязательно должно содержать дату в формате YEAR-MONTH-DAY-name.md
, например 2023-04-22-how-to.md
. Сверху каждого нового файла должен быть заполнен front matter - скрытые свойства заметки. Синтаксис:
---
layout: post
title: 'Заголовок, который будет виден пользователям'
notebook: 'frontend'
tags: [css, html, animation]
---
notebook - это одна из основных рубрик (см. ниже и в сайдбаре).
Можно указать ссылку на источник в sources, если он есть. url должен быть кавычках.
sources: ['https://www.site.com/']
После этого нажмите на кнопку "Отправить пулл реквест", мне придет уведомление и я посмотрю ваше предложение. Я могу его принять, не принять, изменить или предложить изменить вам.
В данный момент на сайте есть рубрики frontend, webdev, backend и pc.
- frontend - html, css, js, верстка и все вокруг этого.
- webdev - сюда я вынес вещи, которые не обязательно относятся к фронтенду, но могут для него использоваться. Например npm пакеты, сборщики и т.п. Это сделано просто, чтобы не сваливать все в одну кучу.
- backend - для любых языков веб бэка. Я сейчас немного занимаюсь node.js и ruby (через jekyll).
- pc - советы, не имеющие отношения к разработке. Подобные вопросы можно найти на superuser, а не stackoverflow.
Вы также можете предложить создать новый раздел, если вам есть, что в него добавить.
- Прототип верстки на базе дефолтной Jekyll темы minima вместо готовой, потому что я не ищу простых путей
- Автоматическое наполнение сайдбара
- Облако тегов, теги в постах
- Поиск по сайту
- Пагинация
- Перенос моих заметок из базы знаний в более презентабельном виде [частично]
- Кнопка редактировать на гитхабе
- Рассказ о создании сайта и о том, почему я не ищу простых путей в about
- Отображение источников из front matter на страницах постов
- Перенести ответы со stackoverflow из моих закладок, которых не было в заметках [частично]
- Главная страница с виджетами, перенос всех постов на отдельную
- Количество постов в облаке тегов
- Перенос на полностью свою верстку (БЭМ без нестинга, устаревших практик, убрать все от minima и т.п.)
- Темная тема
- Гармошка в сайдбаре
- Посты по тегам в сайдбаре
- Подготовить верстку, как тему для jekyll
- Форк поиска
- Улучшения поиска (работающий fuzzy, подробности в результатах)
- Документация для участников
- Локализация интерфейса и содержимого на английский язык (и на русский, где на англ)
- Комменты
- Ваши предложения)
Если что-то не работает заведите, пожалуйста, issue. С любыми вопросами по проекту пишите в дискуссии. Другие предложения и вопросы можно писать на почту или телеграм.