1. Введение
Время летит так быстро, сейчас последняя неделя 2017 года, а сегодня еще и Рождество, а через несколько дней будет Новый год. В конце года все привыкли подводить итоги и делиться, и я не исключение. А вот опыт, я его уже выкладывал ранее, так что поделюсь сегодня! Поделиться некоторыми ресурсами, с которыми я связался с вами, — это подарок на два дана для всех! Надеюсь, вы сможете получить от него необходимые ресурсы. С начала моего контакта с фронтендом и до дедлайна по времени публикации я прочитал много блогов, а также узнал о некоторых опенсорсных проектах Качество неравномерное (были даже реклама и курица статьи супа), но следующая рекомендация Блоги, статьи, проекты или другие ресурсы, с которыми я сталкивался. Не смею сказать, что ресурсы самые лучшие, самые полные и подходящие для всех, но качеством контента я доволен. Могут быть некоторые ресурсы, которые я могу не читать, не понимать и не читать внимательно. Но я думаю, что это может помочь всем и повысить их технический уровень. Я надеюсь, что это может дать вам руководство, руководство или расчистить путь. Если у вас есть хорошие ресурсы, пожалуйста, поделитесь!
Есть несколько ссылок на ресурсы, после этого я добавлю комментарии в скобках! Например:
“продвижение html5(Введение в креативную рекламу, разработанную html5)”аннотации могут быть вызваны следующими причинами:
1. Ресурсы очень хорошие, галантереи стало больше, напоминаем всем смотреть!
2. Ресурс является одним из серии ресурсов. Например, в серии более 20 статей, и каждая статья полезная, я не могу размещать ссылки более чем на 20 статей, поэтому обычно выкладываю первую статью из этой серии, напоминая всем не забывать читай серию!
3. Лично я нахожу некоторые материалы на ресурсе очень полезными, а некоторые нахожу бесполезными! Напомните всем выбирать и смотреть, и смотреть по мере необходимости!
4. Название ресурса может немного вводить в заблуждение, или другие меры предосторожности для ресурса, добавлю свои пояснения и замечания.
2. Рекомендуемые статьи (учебники)
html(5)
Пост-HTML5 Эра I
Пост-HTML5 Эра II(Простое и грубое введение в API html5, без бреда)
продвижение html5(Введение в креативную рекламу, разработанную html5)
Гениально создавайте компоненты подписи холста
HTML5/CSS3(Новые возможности html5 и css3, кратко изложенные дядей Томом)
Ускоренный процесс разработки анимации H5
Руководство по оптимизации производительности внешнего интерфейса Mobile H5
Поэкспериментируйте с мобильными страницами HTML5
Расширенная серия HTML5: загрузка и загрузка файлов
Расширенная серия HTML5: динамические диаграммы Canvas
HTML5 Advanced Series: API перетаскивания для сортировки перетаскиванием(Все статьи из этой серии хороши и их стоит прочитать)
Общие методы производства анимации H5
Супер классический экземпляр Canvas, динамический ионный фон, подвижный красочный маленький шарик, жадная змея, танковая война, человек на 100 этажей, текст в форме сердца и т. д.
Создайте высокую анимацию частиц Canvas
Введение в Canvas — создание и загрузка пригласительных билетов
css(3)
Учебник по свойствам CSS3 и совместное использование кейсов(Сухие товары Дамо CSS3, вы можете увидеть их один за другим, когда входите, что очень полезно для изучения CSS3)
CSS3 реализует 11 классических приемов CSS.(Различные CSS3 Классические примеры сухих товаров, полезные для CSS3)
W3cplus demo(кейс W3cplus, стоит посетить)
мощный css3(статья, в которой описываются новые возможности css3)
Классическая серия учебных пособий по CSS3(Не забудьте прочитать эту серию, все статьи хороши)
Личное резюме (новые функции css3)
Разминка CSS3 — переходы и анимация (чтобы получить крутой выпадающий список, аккордеон, бесшовную прокрутку)
Напишите свою собственную кодовую базу (реализация общих анимаций CSS3)
Возможно, vue+css3 легче делать интерактивные эффекты.
Советы по написанию CSS и сводка по оптимизации производительности
Как написать легкий CSS-фреймворк
21 продвинутый совет по CSS
Оригинал: Технология CSS3 — адаптивное масштабирование спрайтов и схема анимации спрайтов
Учебное пособие по гибкому макету: синтаксис
Учебное пособие в Flex: Примеры
Прекрасные формы CSS (графика CSS)
Используйте CSS3 для создания графики различных форм (от других)
Интересная тема CSS (1): Реализация левой вертикальной полосы(После прочтения первой статьи можете глянуть вниз, это всегда поможет, но иногда этот сайт не может загрузить картинку, если картинка не загружается, отказывайтесь или настаивайте, давайте примем решение)
Чистый CSS для достижения эффекта волны!
Определяйте производительность CSS-анимации с помощью инструментов разработчика браузера
Получить эти неизлечимые заболевания, скажем, да к CSS3 анимации
Эффективный внешний интерфейс 1: не используйте JS, если вы можете использовать html/css для решения проблемы.
Как сделать анимацию более естественной
css рисование графики
css различные эффекты мыши
Узнайте больше о том, что нового в CSS3(Также общее резюме, эта серия рекомендуется)
Как передняя часть может вызвать ветер и дождь
Резюме классного использования :after и :before
Волшебный конически-градиентный конический градиент
10 примеров качественной анимации логотипов на CSS и JS
Freed GPU — повышает производительность CSS3
[Резюме проекта] Общий дизайн архитектуры внешнего интерфейса сайта электронной коммерции (1)(После прочтения первой части не забудьте посмотреть серию ниже)
[Организация] Схема компоновки CSS
CSS: Флажок по умолчанию, ввод, радио слишком уродливы? Я научу вас менять стиль по умолчанию с анимацией, переписанной на чистом css3.
20 практических трюков с кодом CSS
Анализ производительности CSS, как оптимизировать CSS для повышения производительности
Черная магия CSS, позволяет писать меньше ненужного JS, код более элегантный
Прогрессивные анимационные решения
Что нового в CSS
Оптимизация производительности анимации CSS
【Перепечатка】Высокопроизводительная анимация
Прекрасные формы CSS (графика CSS)
sass
Руководство по использованию SASS
Восемь советов по написанию Sass
javascript
Глубокое понимание серии JavaScript(Серия статей по JavaScript, написанная дядей Томом и включающая различные знания, очень полезна для изучения и углубленного изучения js)
JavaScript Core Concepts Collate(общее описание некоторых основных концепций js)
От соответствия к совершенству — разработка API
Функциональное программирование JavaScript, как я его вижу
компонентизация javascript
Как написать небольшие и очищенные функции? (Версия JS)
Подробное объяснение объектов javascript: разница и связь между __proto__ и прототипом
Разобраться с ориентацией объекта в javascript (1) — прототипное наследование(Эта колонка (практическая первая) хорошего качества и заслуживает внимания)
Подробное микроинтерфейсное объяснение распространенных шаблонов проектирования в Javascript.
10 лучших практик разработки JavaScript, которые вам нужно знать
Глубокое понимание прототипа javascript и серии замыканий
Краткое изложение изучения JavaScript (1) Основная часть(Эта серия статей хороша, не забудьте прочитать эту серию, но каждый должен найти статьи этой серии в той колонке, где опубликована статья, потому что автор не публикует серию статей в этой колонке, а посередине есть и другие статьи, но тоже очень легко найти.В этой колонке(trigkit4), даже если это не этот цикл статей, я прочитал несколько из них, и чувствую себя очень хорошо, можете обратить внимание)
Шаблоны проектирования JavaScript и практика разработки | 01 — Объектно-ориентированный JavaScript(Эта серия туториалов хороша, заметки "JavaScript Design Patterns and Development Practice", я тоже читал эту книгу, эта книга хороша, и автор хорошо ее резюмирует, все ее прочитали и много почерпнули)
Есть ли проблемы с производительностью при функциональном программировании на JavaScript?
Как сделать JS красивее
Обычная дорога JS — изучение эффектов в глазах популярности (Часть 1)
Вы все еще используете циклы for?
Принцип и реализация фронтенд-шаблона
Всего 20 строк кода Javascript! Научите вас, как написать механизм шаблонов страниц
[Учебное направление] 150 строк кода научат вас реализовывать низкопрофильную версию библиотеки MVVM (1) - Принципы
[Учебное направление] 150 строк кода научат вас реализовывать низкопрофильную версию библиотеки MVVM (2) - Code Articles(Можно обратить внимание на колонку, соответствующую этой статье, она хорошо написана, интересно, напишет ли автор следующую)
Как выучить JavaScript шаг за шагом и эффективно?
Помните о регулярных выражениях JS
JavaScript углубленно понимает двустороннюю привязку данных
Реализуйте простую библиотеку MVVM с привязкой данных JavaScript.(Помимо простого построения колеса, эта статья важнее для понимания принципа MVVM на примере)
Вводный 30-минутный курс по регулярным выражениям
Как отслеживать изменения DOM страницы и эффективно реагировать
Руководство по использованию IntersectionObserver API(С помощью этого API может быть проще реализовать ленивую загрузку изображений и другие вещи, а производительность выше)
(По следующим трем ссылкам несколько тем на Zhihu. Качество ответов в ней неравномерное. Можете выбрать несколько качественных ответов, чтобы посмотреть, что обязательно поможет)
Какие коды js стоит прочитать, как фронтенд-разработчику?
Каковы приемы и приемы JavaScript?
Какие интересные вещи можно делать с помощью JavaScript?
Насколько велика дыра в мозгу фронтенд-инженеров для борьбы с краулерами?(Антикраулерская статья, только неожиданная, но не невозможная)
Эти черные технологии программирования на JavaScript, принудительные руководства и высококачественные коды удивят вас.
Как написать хороший JavaScript — разговор о дизайне API
Шаблоны проектирования JavaScript ① Правильное использование позиции объектно-ориентированного программирования(прочитайте первое, не забудьте следующее)
Как элегантно писать код JavaScript
Личное резюме – практические навыки работы с JavaScript и предложения по написанию
Воспроизведение последовательности анимации JavaScript в 65 строках кода
Как реализовать компонент разблокировки жестов с помощью собственного JS
Карта разума Javascript
Чистая интерфейсная реализация распознавания-извлечения-синтеза лиц
Наиболее полная сводка регулярных выражений: проверьте номер QQ, номер мобильного телефона, адрес электронной почты, китайский язык, почтовый индекс, удостоверение личности, IP-адрес и т. д.
99% людей неправильно понимают разницу между GET и POST в HTTP.
Сбор веб-сайта JavaScript(Включает несколько веб-сайтов для практики js, вы можете практиковаться, когда у вас есть время)
Повторное введение в JavaScript (учебник по JS)
Напишите свою собственную кодовую базу (реализация и инкапсуляция общих экземпляров JavaScript)
javascript вопросы для интервью, которые меня впечатлили
Обновление JavaScript Fighting Monsters — бизнес-логика как упражнения
javascript (es6, es7, es8)
Руан Ифэн es6(Можно использовать как онлайн-книгу для документации es6)
Вещи ES6, о которых вы могли не знать — основы
Вещи ES6, о которых вы могли не знать — продвинутый уровень
Освойте основной контент ES6/ES2015 за 30 минут(Простое и грубое введение в ядро es6)
Восемь фрагментов кода, чтобы полностью освоить Promise
Что нового в ECMAScript 6(краткое описание часто используемых новых функций es6)
Пример, чтобы почувствовать общий синтаксис и преимущества es6
10 лучших функций ES6
Расскажите о возможностях ES7 и ES8.6 причин, по которым Async/Await заменяет обещания
Изучите ES7+ES8 за 10 минут
Подробное объяснение смешанного использования import, require, export и module.exports.
typeScript
Официальная документация сайта(официальный документ ТС, хорошо написанный)
jquery
анализ исходного кода jquery
100 советов по jQuery (перевод)(После прочтения этой статьи я чувствую, что изучаю поддельный jquery, но я сам не пробовал многие техники, поэтому оставляю свое мнение)
Вы должны помнить об этих нескольких правилах для JQuery, чтобы повысить производительность.
Яма JQuery, расскажите о ямах, на которые ступали все(Новичкам эта статья тоже поможет)
Заметки об изучении jQuery(Сводка объясняет API, обычно используемый jquery, что тоже хорошо)
Краткое описание разработки плагина jQuery
jQuery === спагетти-код?
vue
официальный сайт вью
Vue2.x наступает на яму и подведение итогов
Вы не знаете, но очень практичная черная технология в Vue
Разница между каштановой практикой vue2.0 и 1.0
Я никогда не видел такого краткого и простого для понимания руководства по Vue.
vue-API(версия 2.3 API Daquan)
Детали разработки плагина Vue.js
Написание плагина Vue и реальный бой(Процесс от разработки до релиза, пример простой и понятный)
Календарь, созданный с помощью Vue.js
Повышение зарплаты DAY10 "Обзор библиотеки проектов Vue с открытым исходным кодом(Библиотеки есть всякие, ну и качество конечно высокое и низкое, все берут и видят.)
Практические навыки Vue.js (1) (прочитайте первое, остальные не забудьте)
Углубиться в основную идею vue2.0 — рендеринг шаблонов
Vue.js — быстрый ввод vue-router за 60 минут
Исходный код Vue2.1.7
Разбор принципа реализации Vue — как реализовать двухстороннюю привязку mvvm
Начало работы с Vue.js (1) — понимание фреймворка MVVM
Анализ исходного кода Vue2 — логическая сортировка
Научите вас разворачивать компонент всплывающего окна vue2.0
Объясните принцип отзывчивости на основе «сбора зависимостей».
Краткое изложение практического проекта Vue Family Bucket
пример записи vuex (1/3)
Оригинальный каталог учебных пособий "Vue2.0 Advanced Series"
Другой способ: одностраничный vue, мультимаршрутизация, обновление вперед, назад без обновления
vuejsexamples(Различные демонстрации vue могут иметь необходимые требования)
Три небольших примера быстрого запуска vue(Моя собственная статья, более простое использование, с тремя небольшими примерами, объясняющими введение vue.)
Разработайте так называемую судоку с помощью vue.
webpack
(Некоторые из следующих статей взяты из веб-пакетов 1.x и 2.x. Учитывая, что сейчас он обновлен до версии 3.x, вам следует обратить внимание на разницу при чтении)
китайская сеть webpack
официальная документация по веб-пакету
Оптимизация использования веб-пакета (базовая)
Введение в общие функции веб-пакета
Webpack 3 Zero Basic Tutorial #1 — Введение(Прочитав первую статью, не забудьте следующую, этот сериал стоит посмотреть)
Опыт Dev Tools: как в 10 раз повысить эффективность сборки Webpack
Разделение кода Webpack Dafa
Серия статей об архитектуре многостраничных приложений Webpack (1): шаг за шагом для решения архитектурных проблем(После прочтения первой статьи не забудьте остальные, эта серия статей хороша)
parcel
Анонс Parcel: быстрый инструмент для упаковки веб-приложений, не требующий настройки
Передовые строительные инструменты Tucao и минимальное знакомство с посылкой
Бросить: привет посылка
От веб-пакета до полного охвата Parcel #1 Исследуйте Parcel(В этой статье следует использовать последующий контент, вы можете следить за ним)
gulp
Gulp подробное вводное руководство
Введение и навыки работы с интерфейсным инструментом построения gulp
Начало работы с глотком
react
(Я только что вступил в контакт с реагировать, и я только временно видел эти два веб-сайта)
Реагировать Китай
Серия учебных пособий по стеку технологий React
Спецификация компонента Reactсуществует
Несколько советов по изучению React + Redux в 2017 году (часть 2)
Советы по изучению React + Redux в 2017 году (часть 2)
Изучить React.js проще, чем вы думаете
git
Обезьяны GIT могут понять
Учебник по Git — Официальный сайт Ляо Сюэфэна
browsersync
node.js
Использование npm — руководство по NodeSource для начинающих
Node.js и npm — основы Package.json в NodeSource
Настройте .npmrc для оптимальной среды Node.js.
Markdown
Понимание и начало работы с Markdown
yoeman
Научить вас создавать интерфейсный инструмент для строительных лесов с нуля
lodash
Это библиотека инструментов JavaScript с согласованным интерфейсом, модульностью, высокой производительностью и многим другим.
Версия 4.17.4
Fiddler
Официальный сайт
Учебник по скрипачу
отладка
Оптимизация веб-отладки — неполное руководство по инструментам разработчика Chrome
Поделитесь несколькими ежедневными методами отладки, чтобы упростить отладку js
Отладьте свой JavaScript с помощью Chrome
Использование консоли в JavaScript(Прочитав эту и предыдущую статью, вам может показаться, что вы никогда раньше не будете пользоваться консолью)
Серия инструментов разработчика Chrome
Состояние Интернета: руководство по улучшению производительности веб-страницы
Сводка по проблемам мобильной веб-разработки и оптимизации
Неполное руководство по внешней оптимизации
детали, оптимизация
Рассказываем о лучших практиках мобильного интерфейса
Мышление, вызванное фронтенд-оптимизацией, разговор о фронтенд-инжиниринге
Краткий обзор практики фронтенд-оптимизации
Уменьшите связывание внешнего кода
Судя по тому, что загрузка одного и нескольких изображений завершена
Обнаружение частоты повторения терминального кода
[Компонентная разработка] Как писать поддерживаемый и обновляемый код в главе о расширенном интерфейсе
Как веб-разработчик, какие технические детали вы должны учитывать перед публикацией своего сайта?
[Одностраничное приложение] Как мы поступаем с иерархическими отношениями всплывающего слоя фрейма?
Удалите код шаблона, чтобы ускорить загрузку веб-страницы
Серия мобильных интерфейсов — оптимизация производительности мобильных страниц
[Серия чатов] Давайте поговорим о скорости интерфейса мобильной домашней страницы Baidu.
разное
socket.io китайское руководство socket.io китайская документация
WebSocket и Socket.IO
VR Evolution | Научить вас создавать общий проект WebVR
Начало работы с RxJS
deeplearn.js: платформа машинного интеллекта на стороне браузера
Совместное использование и контрольный список навыков
С годом Петуха! Еженедельник Front-end (выпуск 15)(Хотя уже почти год собаки, содержание в нем не устарело)
Избранное интерфейса(Как и в приведенной выше статье, это резюме других, и там много галантереи, но «фаворитов внешнего интерфейса» может быть слишком много ресурсов, и это дает мне ощущение, что я немного ресурс, пока это ресурс, выкладывайте все.Заходите, качество небольшого количества ресурсов низковато, рекомендуется приносить свои эталонные идеи)
Избранное мобильных веб-галантереи
awesomes(Огромная библиотека ресурсов во внешнем интерфейсе со всеми ресурсами в ней)
база знаний(Иметь много языков, каркас, карте библиотеки, стоит увидеть! Можете ли вы понять, какой язык, рамки, библиотека, включенные в точку зрения, все детали знаний, есть каштаны и статьи, такие как:граф знаний javascript,График знаний HTML5,граф знаний реакции)
Общий доступ к внешним ресурсам
Чтобы дать вам перед собой, я рекомендую несколько предварительных резюме статьи. - знаю почти колонку
Front-end-Разработчик-Интервью-Вопросы
Front-end проекты, на которые стоит обратить внимание на github(Список проверен богом Trigkit4, в нем много рекомендуемых предметов, каждому может понадобиться по мере необходимости)
Передняя часть (книжная колонка)
FPB 2.0: Бесплатные китайские книги по компьютерному программированию 2.0(Поклонники, пересекающие великого бога, чтобы поделиться книгами, всевозможными книгами, с несколькими интерфейсами, вы можете увидеть выступление)
Передний список книги для веб-инженеров Tencent
Руководство фронтенд-разработчика
Выходные данные Китайский - Руководство(различные документы по разработке, webpack, vue, sass и т.д.)
(Следующие ссылки не являются статьями или проблемами. Все они являются официальными соревнованиями, проводимыми segmentfault, обменом или обсуждением контента. Просмотр обмена и кодов великих богов выше определенно что-то выиграет)
1024 Как вы придумали эти вопросы на четвертом уровне HackGame?
Принеси все SegmentFault домой - кодируй статью, отправь окружающим
Второй раунд официальной доставки книги - SF осанки роста призывает вас говорить о развитии
Официальное мероприятие, SF простым языком призывает поговорить о разработке! Хотите поделиться своими знаниями в области разработки?
Официальное соревнование по 30-строчному js: Что вы можете сделать с 30-ю строками js?
[Официальный конкурс] Сообщество 1111 показывает код, позвольте вам показать и позволить вам летать!
3. Рекомендуемый блог
Блог команды
Фронтенд-команда Taobao накормлена
Алибаба
Команда разработчиков Baidu
Танцевальная труппа 360 Ци
Видеоурок танцевальной труппы Ци
Отдел JD Design Experience - Bump Lab
Центр передовых исследований и разработок Tencent
Команда сплава Tencent
Внешняя команда Tencent IMWEB
Интерфейс Tencent IMWEB team-github
Тенсент Игры
Сина УЭД
Группа мобильной архитектуры Qunar
Большой передний конец (голодный?)
Блог команды Soche Great Wireless
(Вышеупомянутый блог команды достоин внимания. Содержание поста в блоге качественное, но обновляется нечасто. Следующих обновлений будет больше и качество тоже хорошее)
Блисс Технология
Интерфейсное сообщество IMWeb
Любите интерфейс — знайте колонку
Фронтальный продуктовый магазин
Рецензии на зарубежные журналы
Фронтальный продуктовый магазин без забот
Еженедельник технологий DDFE
верхняя часть фронта
Резюме ФРС
Блог Даниэля
Тропа десятилетия
Чжан Синьсюй
Руан Ифэн
Е Сяочай
Блог Ситу Чжэнмэй
дядя том
Ляо Сюэфэн
крючок три доли четыре
chokCoCo
chokCoCo-github
Cherry's Blog
Блог о передовых технологиях, которым поделился Ya X - front-end road
4. Рекомендуемые книги
Книги, которые я читал, довольно разные, связанные с внешним интерфейсом, и я рекомендую следующие! Я прочитал все следующие книги, разница в том, что некоторые из них были прочитаны полностью (некоторые из них были перечитаны несколько раз), а некоторые из них были прочитаны в общих чертах (некоторые из них только прочитайте несколько страниц)!
Для предложений по чтению книг вы можете выбрать и прочитать следующие книги в соответствии с вашими потребностями и интересами. Книга, не дочитывайте ее, нужно понять содержание книги. Некоторые книги стоит перечитывать несколько раз!
Что касается книжных ресурсов, рекомендуемые ниже книги (я читаю электронные книги) все загружены из Интернета. Во избежание нарушений я не буду ставить здесь ссылки на ресурсы! Купите собственные бумажные или электронные книги или найдите ресурсы в Интернете!
«Продвинутое программирование на JavaScript»: («Красная книга» или «Рубиновая книга») может использоваться как вводная книга, но это также и продвинутая книга, которая может быстро освоить основы, а затем вернуться и перечитать ее снова, когда вы улучшите
"The Definitive Guide to JavaScript": (Rhino Book) можно сказать, что это самая классическая книга по js. Начинающим читать ее может быть сложно, но для тех, кто изучает js, она необходима, и если вы не Не понял, можешь проверить, это очень полезно.
JavaScript Описание структур данных и алгоритмов (Hedgehog Books)
Написание поддерживаемого JavaScript (Turtle Books)
Искусство программирования DOM на JavaScript, 2-е издание
«Сущность языка JavaScript» (книга Butterfly): классическая книга и книга, которая популяризирует подходы разработчиков к JavaScript.
«Проектирование инфраструктуры JavaScript» (второе издание) — Ситу Чжэнмэй
«Шаблоны проектирования JavaScript» — Чжан Жунмин (книга, написанная сотрудниками Baidu, пример наглядный и простой для понимания, а задействованные шаблоны проектирования относительно полны)
«Шаблоны проектирования JavaScript и практика разработки» — Цзэн Чен (книга, написанная сотрудниками Tencent, в которой рассказывается о 14 наиболее часто используемых шаблонах проектирования в js)
«JavaScript одностраничного веб-приложения от внешнего интерфейса к внутреннему»
"Начало работы с ECMAScript 6" можно использовать в качестве книги для документации по новым функциям es6, и эта книга с открытым исходным кодом (ECMAScript 6 入门), просто смотрите прямо! Вы также можете купить его, если вам это нужно!
«Практика мобильной веб-разработки HTML5»
Руководство по веб-разработке HTML5 для мобильных устройств
«Основная технология холста HTML5»: испытать очарование, используемое для достижения холста анимации, и очень полезно.
"Авторитетное руководство по HTML5 и CSS3, третье издание" - Лу Линню, эта книга, кажется, имеет такое же название, обратите внимание на автора, и книга разделена на первый том и второй том. В то время я читал второе издание, и теперь, когда вышло третье издание, я рекомендую третье издание.
"Sharp jQuery": Я только что прочитал эту книгу, чтобы изучить jQuery. Эта книга не очень впечатлила моих сверстников, но я чувствую себя хорошо, и я только что прочитал эту книгу, когда изучал jQuery, поэтому я рекомендую эту книгу!
«Удивительный Node js доводит JavaScript до конца»
"Секреты CSS": Прочитав эту книгу, я больше не осмелюсь сказать, что знаю CSS! Их так много, что вы даже не представляете!
5. Рекомендовать сообщество
Хотя рекомендуемых сообществ очень много, из них я зарегистрировался и активно работает всего два или три.Остальные сообщества в основном те, с которыми я столкнулся, когда учился, и я думаю, что они хорошие, поэтому я также рекомендую их. . Что касается того, в каких сообществах вы хотите быть активным, решать вам. Если у вас есть хорошие ресурсы сообщества, пожалуйста, порекомендуйте их!
github: Это поначалу я часто ищу ресурсы по нему. Но я не регистрировал учетную запись, но босс уговорил меня зарегистрироваться, поэтому я пошел. В нем вы можете читать чужой код и учиться у всех!
Редкоземельные самородки: сообщество, в котором я сейчас активно работаю, — отличное место для написания статей!
segmentfault: В настоящее время я активен в сообществе, которое фокусируется на вопросах и ответах, а также статьях и лекциях Качество также очень хорошее!
Знай почти: Хоть это и не чистое IT-сообщество, но в нем много больших коров и качественных колонок!
stackoverflow: сообщество вопросов и ответов, где можно найти ответы практически на все вопросы.
w3cplus: веб-сайт с интерфейсом, качество статей внутри довольно хорошее, особенно о CSS (3)
Интерфейсная сетьпередняя часть рагу: Сообщество для обмена статьями, есть много отличных статей.
Заголовки разработчиков
Еженедельный интерфейс
HTML5 DreamWorks
дипломированный монах
МООК(Кажется, что многие видео сейчас платные. Когда я смотрел их раньше, они были в основном бесплатными)
Хуэйчживан
6. Официальный аккаунт
Фронтенд Дацюань
segmentfault
верхняя часть фронта
Фронтенд утренний класс
W3cplus
Редкоземельный круг
(Картинка выше взята из сети)
7. Рекомендуемые пункты внимания
проект на гитхабе
vue
react(Я только несколько раз подвергался реакции, это неплохо, и я сейчас учусь)
gulp
parcel
webpack
d3
chart(D3 и как часть визуализации данных, опытные, но не используемые в проекте, чувствуются мощными, это рекомендация)
element-ui(Библиотека компонентов, разработанная на основе vue2.x, обычно используется для разработки системы управления фоном. Теперь управление фоном, разработанное нашей компанией, использует это)
muse-ui(Это также библиотека компонентов на основе vue, пользовательский интерфейс очень красивый)
Изучайте Node.js вместе(На самом деле это должно быть руководство по node.js)
Решение AlloyTeam для мобильных жестов
frontend-dev-bookmarks(Обучающий контрольный список для всех аспектов внешнего интерфейса)
Бесплатные китайские книги по программированию(китайский обмен книгами, не только фронтендом, но и во всех аспектах, каждый может просмотреть его по мере необходимости)
animate.css
hover.css
muse-ui(Библиотека пользовательского интерфейса, основанная на vue2.0, с красивым стилем и полным разнообразием)
CSS3 реализует различные 3D-эффекты блог(Принадлежит тому же автору, что и следующие три ссылки. Эта работа Даниэля хороша и эффект классный. Хотя количество звезд несравнимо с другими рекомендуемыми проектами, рекомендовать стоит)
chokcoco/boomJS
chokcoco/magicCss
chokcoco/iCSS
handtouch
awesome-vue
Electron
vue-skeleton-webpack-plugin
Личный блог Лян Шаофэна(Качество статей внутри тоже хорошее, есть всякие, js, jquery, vue, react, node.js и т.д.)
RxJs
deeplearn(Опубликован Google, фреймворк для глубокого изучения искусственного интеллекта, вы можете прочитать его, если вам интересно, я читал его некоторое время, но так и не понял)
(Следующие два проекта являются моей собственной разработкой. Хотя им не хватает огня по сравнению с другими проектами, они не слишком бесполезны или неуправляемы. Их также можно рассматривать как мою небольшую рекламу! (●'◡'●)) )
ec-do(Он инкапсулирует экземпляры javascript, обычно используемые в повседневной разработке. Экземпляры представляют собой небольшие экземпляры, обычно используемые в повседневной разработке, включая дедупликацию массивов, зашифрованные массивы, преобразование регистра букв, инкапсуляцию операций cookie и т. д.)
ec-css(База кода, разработанная на основе CSS3, включая эффекты перехода при наведении курсора, анимационные эффекты и предустановленные анимации для повседневного использования)
Другие рекомендуемые элементы
Библиотека пользовательского интерфейса Tencent css3
NEC: лучшее решение для стилей CSS(Решение css3 от NetEase, но оно кажется довольно старым и не поддерживается, но кейсы внутри можно использовать для справки, это определенно полезно)
8. Подробное руководство по проекту (учебная запись)
Реализуйте базовый сценарий чата, используя node.js + socket.io + redis.
Фронтенд-разработка, от простых людей до героев (Часть 1)
Фронтенд-разработка: от простых людей до героев (Часть II)
Моя передняя продвинутая дорога(Глядя на название, подумал, что это отступление, на самом деле, ощущение - краткое изложение статьи, вы можете посмотреть)
Найдите новую идею для своей мобильной страницы — сводка проектов мобильных интерактивных веб-страниц (часть 1)
Найдите новую идею для своей мобильной страницы - резюме проектов мобильных интерактивных веб-страниц (часть 2)
Руководство по разработке интерфейса 2017
[Практический HTML5 и CSS3, часть 1] Предварительное исследование глубины воды, красивая навигация и великолепный взрыв изображения! !(Не забывайте следующее после прочтения, это настоящая битва официального сайта Е Сяочая, имитирующая разведывательное общество)
Компонент мобильного всплывающего окна (Alert, Confirm, Toast) на основе Vue 2.0.
Откройте для себя лучшее из себя - как создать наиболее подходящие компоненты в дизайне
бой проекта webpack+vue (1, сборка работающей среды и соответствующая конфигурация)(Моя собственная статья об использовании vue+webpack для разработки одностраничного приложения, а также о разработке и построении системы фонового управления, в этой серии пять статей)
9. Разговор о развитии
Веб-интерфейс — 10 стилей обучения, которые мешают прогрессу
Два года во внешнем бизнесе научили меня этим истинам
Личное мнение об ИТ учебных заведениях
OpenDoc - Критерии рейтинга резюме для внешнего интерфейса(Рейтинг резюме, выданный Meituan, вы можете обратиться к нему соответствующим образом и сравнить свои силы с рейтингом Meituan. Конечно, вы также можете пойти на собеседование, если вам интересно)
Спецификации внешнего интерфейса и лучшие практики
Vue.js хорош, но лучше ли он Angular или React?
Разговор о выборе технологии — Angular2 против Vue2
Написано для фронтенд-инженеров, руководство по выбору мобильного приложения
Архитектура сайта - с нуля
интерфейсная архитектура
Руководство по развитию технических гуру, успешная практика обучения без куриного бульона
6 фреймворков JavaScript, которые стоит изучить
6 простых советов для быстрого изучения JS
Как программисты изучают английский
8 карьерных советов, о которых программисты сожалеют
Остерегаться! Программистам следует опасаться семи неверных карьерных планов
1024 День программиста, советы молодым программистам
10 советов начинающим программистам
Что мне делать с таким количеством интерфейсных фреймворков?
Тренды фронтенд-разработки в 2017 году
Современный стек технологий фронтенд-разработки
Я слышал, что вы хотите написать фронтенд в 2017 году?
Как быть в курсе последних новинок фронтенд-разработки
Топ-7 карт навыков, которые должен знать фронтенд-разработчик
Резюме навыков работы с интерфейсом (JacksonTian)
Еще одна сводная диаграмма интерфейсных навыков(То же, что и ссылка выше, но если вы ее читали, то рекомендуется читать со ссылкой)
Как стать отличным фронтенд-разработчиком?
Какой технический уровень должен быть у фронтенда с зарплатой 10-12к в месяц?
Какие коды js стоит прочитать, как фронтенд-разработчику?
Говоря о фреймворке переднего плана, не говоря о нем
Руководство разработчика интерфейса (2017 г.)
Почему некоторые компании нанимают фронтенд-специалистов, которым не нужны курсы обучения?
Новичкам во фронтенде нелегко
Передняя часть сети уже перенасыщена?
Обзор разработки передовых технологий за 2017 г.
Продвинутый гексо-учебник: научит вас, как сделать ваш гексо-блог первым в поисковых системах(Можете глянуть, если интересно, полезно)
Юридическая сторона open source(Поскольку зарубежные страны уделяют большое внимание авторскому праву и лицензии, в этой статье говорится о статье о лицензии после того, как код будет открыт, что меня немного смущает, но после окончательной договоренности мой проект с открытым исходным кодом использует MIT)
10. Разрабатывайте часто посещаемые веб-сайты
Техническая документация MDN-web
Онлайн-инструмент сжатия Zhitu_image_онлайн-производственный веб-сайт
Преобразование изображений Multiview Base64
Документация WeChat JS-SDK
Кормовой QR-код
учебник для новичков
w3cschool
11. Резюме
Что ж, статьи в блогах, которые я читал о внешнем интерфейсе, Дэниелс и проекты, за которыми я следил, а также учебные пособия по стеку проектных технологий в основном здесь! Этими я делюсь, не смею сказать, лучшими, самыми полными, подходящими для всех. Но это все, что я видел или соприкасался, по крайней мере, я доволен содержанием, и я думаю, что это полезно для изучения и может помочь каждому. Если у вас есть какие-либо учебные ресурсы, которые можно порекомендовать, я также надеюсь, что вы не поскупитесь поделиться ими со мной и раздать всем!
Эта статья представляет собой сборник ресурсов для всех, но для меня это может быть разделительной линией. После публикации последней статьи в 2017 году я могу в будущем сосредоточиться на углубленном исследовании исходя из прагматической основы.Публикуемые статьи могут быть более глубокими, чем текущие статьи, а вывод статей может быть не таким часто, как сейчас!
Другое предложение состоит в том, чтобы изучить переднюю часть Интернета, и вышеупомянутый обмен может сыграть роль в руководстве, руководстве и рассеивании сомнений. Однако не забывайте больше практиковаться, ведь практика важнее всего! Если у вас есть свободное время или выходные, вы также можете заняться собственными проектами, которые вам интересны, и использовать их в развитии собственных проектов! Проект не стремится быть лучше других, а лишь тренироваться и повышать свой технический уровень!
------------------------- Великолепная разделительная линия --------------------
Хотите узнать больше, обратите внимание на мой публичный аккаунт WeChat: В ожидании книжного магазина