• Какие есть обучающие ресурсы по фронтенд разработке?

    edward04
    @edward04
    Начинающий ninja frontend
    https://www.youtube.com/channel/UC7enHM_oJRYJOnyJr...
    https://www.youtube.com/channel/UCZeU17nbVfzczAkJV...
    https://www.youtube.com/channel/UCHHw70vvbfyM6xJQo...
    https://www.youtube.com/channel/UCIIt69f5D44s2cdb9...
    tohtml.it/post/74511047203/markup-process

    По нему скучаю искренне и иногда сижу на подоконнику с лате и смотрю на капли дождя, стекающие по стеклу:
    https://www.youtube.com/channel/UCdnFX7mzgup9moXG2...
    Это для общего развития:

    https://stepic.org/course/%D0%90%D0%BD%D0%B0%D0%BB...

    Похожий вопрос:
    Какие задачи нужно уметь выполнять на JS начинающему?

    Ваша библия:
    https://developer.mozilla.org
    Можно докинуть еще:
    webref.ru
    htmlbook.ru
    Просто случайная ссыль
    https://docs.google.com/document/d/1kehaJKKRo7zxYp...
    Еще одна:
    https://github.com/ihorzenich/html5checklist
    Еще какая то штука
    https://github.com/dypsilon/frontend-dev-bookmarks
    Лучшие практики тостеровцев
    Как вы начинаете вёрстку сайта?
    Инструменты
    fredsarmento.me/frontend-tools

    После пары часов выпускания пара из ушей, включить на всю громкость и хоть как то отвлечься от этой жизни
    https://www.youtube.com/channel/UCY0C6A3t3RTUN3BB6...

    На freecodecamp.com неплохо алгоритмы можно потренить

    Ну и конечно
    learn.javascript.ru

    PS
    еще это
    Какие ресурсы с новостями по web-разработки вы знаете?

    PSPS
    Не отвечаю за качество контента под ссылками, может кое что уже outdated.

    https://vk.com/video79753760_171233585

    Удачи, брат
    Ответ написан
    4 комментария
  • Как создать сайт вроде спрашивай.ру?

    HoHsi
    @HoHsi
    Не стоит сразу же замахиваться на большой сервис, начните постепенно. Каждый начинающий программист первым своим проектом грезит сделать убийцу ВК / FB. Скажу сразу, это с первого раза не выйдет. Как не выйдет и с 10. Но! Это не повод, что-бы не развиваться и не учиться. Итак если вы все же решили потрать пару месяцев на обучение, или вы уверены, что пойдет меньше, начните так:

    Шаг первый
    Html. Это язык разметки, на котором написано 100% веба, то есть это необходимая вещь де-факто. Он позволит вам разместить текст на странице, оформить ее.
    В базовой аналогии, это ворд для интернета (кышь Ъ праграммысты, это довольно хорошая аналогия для новичка, продолжим...).

    Это займет +- 1 неделю

    Вам помогут:
    * htmlbook

    Шаг второй
    CSS. Это язык стилизации. Перекрасить текст, увеличить отступы, сделать тень у блоков это к нему. Все крависости в интернете делаются на нем. 99% веба использует для стилизации именно его, так что опять же это стандарт.

    Это займет +- 2 недели

    Вам помогут:
    * Sorax

    Шаг третий
    PHP. Это уже язык программирования (плохой, больной, уродливый, но язык. Да начнется холивар). Он поможет вам понять как это работает, как устроена кухня. Поковыряйте его, обучитесь начальной логике и алгоритмам. Он поможет вам выводить HTML более осмыслено, т.е. вы сможете уже составлять динамические страницы, которые могут подстраиваться под пользователя, добавлять посты, вопросы, картинки и т.д.

    Это займет +- 2 месяца

    Вам помогут:
    * php.net

    Шаг четвертый
    Wordpress. Это почти готовый сайт. В нем уже есть все, что вам нужно. Вы можете писать посты, делать обсуждения и т.д. На его основе вы сможете вылепить что угодно, даже тот самый вопросник. Он написан на PHP, так что он будет дополнять ваши знания. Как только научитись ставить WP, попробуйте написать для него шаблон, потом плагин, и еще и еще. Это закрепит и разовьет ваши предыдущие знания.

    Это займет +- 2 месяца

    Вам помогут:
    * wp-kama

    Шаг пятый
    MySQL. И в частности язык запросов SQL. Это база данных. Они нужны, что-бы хранить информацию вашего сайта в удобном виде. Т.е. по своей сути это таблица экселя, в ней есть поля и их значения. Это так же необходимые знания, так как ваши вопросы из вопросника будух храниться именно там.

    Это займет +- 1 месяц

    Переломный момент
    Наступает переломный, это значит что по истечению полу-года вы должны сесть и подумать, нравится ли вам, что вы делали. Это важно. Так как дальше не будет проще, не будет легче. Начнутся такие вещи как Асинхронность, Брокеры сообщений, ООП, MVC, и другие страшные слова, которые ровно как и предыдущие шаги по-началу будут вас пугать, но потом станут лучшими друзьями.

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

    Не спешите так же переходить к шагам ниже, если не уверены в своих силах. Нет ничего плохого, что-бы "посидеть" еще на предыдущих шагах.

    Шаг пятый
    JavaScript. Ура, вы решили, что вы хотите быть программистом, похвально. Этот язык позволит вам сделать ваши страницы более динамичными. Добавить на них анимацию, логику. Этот язык использует 90% веба, так что сомневаться в его значимости нет смысла. Он позволит вам добавить жизнь на ваш сайт.

    Это займет +- 2 месяц

    Вам помогут:
    * Sorax
    * learn.javascript.ru

    Шаг шестой
    Jquery. Это продолжение JS. Это фреймворк (набор готовых функций). Он облегчит вашу работу с JS и позволит делать ее более качественно и быстро.

    Это займет +- 1 месяц

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

    Если вам нравится PHP, он удобен, тогда продолжите изучать именно его, но не стоит бездумно и слепо защищать язык. Если вы чувствуете, что он вас смущает, не противьтесь и просто попробуйте что-то другое. А поверьте этого много.

    Итак развилка:
    Мне нравится PHP, мама я женюсь!
    Ок, тогда вам стоит взглянуть на фреймворки Laravel, Yii 2, вполне хороши. Они довольно мощные и позволят много чего на себе сделать.

    PHP какой-то странный, но мне понравился JavaScript
    Шикарно, значит есть смысл попробовать NodeJS. Это версия языка (Да, я знаю, что нода это среда а не язык, дайте уже объяснить человеку) расчитаная на составление страниц, как PHP. Это очень мощный инструмент, поняв который, вы вряд ли захотите уйти с него. Он поможет вам писать не только сайты, но и приложения для телефонов / планшетов, программы для ПК, возможно игры (но не стоит. По крайней мере с текущим развитием инструментов), демоны, сервисы, консольные приложения и т.д.

    Они оба мне не нравятся
    Что ж, тогда вам могут приглянуться Python, Ruby - эти два языка более близки к PHP, чем JS.
    Или вы за год стали адептом скорости, и не видите большей радости в жизни чем оптимизация и быстрото рендеренга. Ну тогда вам точно понравятся GO и Rust.
    А может быть Dart к тому временем станет мейн стримом, это уже покажет время.

    Что-бы вы не выбрали, это будет хорошим решением.

    Шаг восьмой
    Как говорится, я просто оставлю это здесь. Сейчас нет смысла объяснять, что это, зачем оно и с чем его едет, вы просто взглянете через год на этот список и все поймете.

    CSS:
    * Sass / Less / Stylus

    JS:
    * CoffeeScript / LiveScript / TypeScript
    * Angular
    * Promise

    NodeJS:
    * NPM
    * Express

    Ускорение работы:
    * Gulp
    * Jade
    * Yo

    Остальное:
    * MongoDB
    * MariaDB
    * RabbitMQ

    Шаг 7 и 8 займут у вас всю жизнь
    Это не в коем случае не значит, что язык будет тем же, просто Язык / Технолигия будут заменяться на другую, а смысл будет тем же. Будут новые технологии, будут новые подходы, новые языки. Будет интересно и весело.
    Ответ написан
    15 комментариев
  • Как вы начинаете вёрстку сайта?

    RainMEN
    @RainMEN
    HTML/STYLUS/JADE/JS/Laravel/Joomla/DLE и т.д.
    Верстаю не так давно, верстаю не так часто, но все же верстаю.

    Раз все начали с нуля, а именно с PSD макета, тоже начну с этого момента.

    1. Оцениваю макет, составляю для себя базовую разметку, определяюсь какие главные блоки присутствую, и что должно происходить если их нет.
    2. Оценив какие блоки необходимы, и прикинув структуру сайта иду csstemplater.com/ генерирую по своей структуре HTML/CSS шаблон, если это конечно не LP
    3. Создаю директорию c названием сайта в openserver, в ней создаю директорию HTML , а внутри по шаблону
    • psd- что бы не потерялись, мало ли когда нужно дорисовать что то.
    • css
    • js
    • less
    • fonts
    • img - для компонентов шаблона
    • image - для временного наполнения (слайдеры, изображения в статьях и т.п.)
    • shop/личный кабинет - иногда делю макет на интерфейсы, и раскидываю по папочкам для дельнейшей навигации

    4. Закидываю скачанный шаблон по папкам, вырезаю оттуда reset-ы, так как уже имеется отредактированный и перенесенный в less
    5. Создаю main_site.less - подключаю сюда все все нужные мне less файлы, template.less- прописываю сюда все структурные элементы (header, footer и т.д.), ui.less - обычно если проект не сложный сую сюда все оформление, иногда разделяю все на отдельные блоки, menu/portfolio/modal/btn/ и т.д.
    6. Настраиваю компилятор Less в PHP шторме для текущего проекта, что бы компилировался только файл main_site.less в папку css
    7. В основном использую getuikit.com, ну больше он мне по душе чем бутстрап, скачиваю и раскидываю файлы по папкам, правлю пути в index.html, попутно добавляю комментарии
    8. Открываю и смотрю PSD шаблон сайта на наличии не стандартных шрифтов, если шрифты есть в www.google.com/fonts, то подключаю их, иначе www.fontsquirrel.com, и раскидываю файлики по папкам
    9. Дальше используя Emmet создаю базовую разметку если это LP(header/footer/slider и т.д.), если нет, то начинаю с самого верха делать разметку элементов (logo/slogan/phone/login-widjets и т.д.) попутно добавляю less код в нужные из файлов.
    10. Верстаю до конца все, что есть в макетах. Затем по необходимости создаю шаблон для CMS.

    ЗЫ: Файлики что сделал не минимизирую, только по желанию заказчика, ибо все нормальные фремворки и CMS умеют объединять css и js файлы в 1, попутно минимизируя на лету. Заказчику отдаю все что сделал включая исходники.
    Ответ написан
    Комментировать
  • Простое, как ардуино, только гораздо более быстрое. Что?

    DIHALT
    @DIHALT
    Raspbery PI
    STM32 Discovery

    Была еще какая то ардуина на арме. Да тысячи их. Вопрос лишь в том, насколько вам быстро надо и насколько сложно вы готовы туда залезть.
    Ответ написан
    Комментировать
  • Нужен ли сайт для запросов на статьи?

    хотеть, хотеть!
    Ответ написан
    Комментировать
  • Таблица в хабратопике?

    @IrkDesigner
    Простите, если подобную таблицу:
    A B C
    D E F
    ,
    то так:

    TABLE BORDER
    TR
    TD A /TD TD B /TD TD C /TD
    /TR
    TR
    TD D /TD TD E /TD> TD F /TD
    /TR
    /TABLE

    Перед и после TD, /TD, /TR, TR, TABLE, /TABLE ставим "<>"
    Ответ написан
    3 комментария