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

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

Содержание этой статьи заключается в разработке некоторых инструментов, библиотек, фреймворков и отличных веб-сайтов с технологиями блогов, которые я часто вижу. Все они используются сами по себе, большинство из них до сих пор обслуживаются, а те, которые не обслуживаются, часто сюда не привозят. Контента много, медленно и аккуратно.

HTML

  • awesome-html5Кураторский список курируемых ресурсов HTML5

CSS

  • tailwindcssУдивительные вещи, связанные с Tailwind CSS
  • awesome-css-frameworksСписок потрясающих фреймворков CSS
  • awesome-css-cnРесурс CSS Daquan, китайская версия, включая: препроцессор CSS, фреймворк, структуру CSS, руководство по стилю кода, соглашение об именах и т. д.
  • awesome-cssПодборка замечательного CSS :)

препроцессор

Sass

  • sassЯзык расширений CSS профессионального уровня.

Less

  • lesscss- Язык динамических таблиц стилей.

Styuls

  • stylusВыразительный, надежный, многофункциональный язык CSS, созданный для Node.js.

инициализация стиля

Normalize.css

  • Normalize.cssСовременные альтернативы сбросу CSS

Tailwindcss

  • tailwindcssПервая в мире CSS-инфраструктура для быстрой разработки пользовательского интерфейса.

Materializecss

  • materializecss

  • Materialize — CSS-фреймворк, основанный на Material Design.

Bootstrap

  • bootstrap
  • Самая популярная среда HTML, CSS и JavaScript для разработки адаптивных мобильных проектов в Интернете.

Postcss

  • postcss
  • PostCSS — это инструмент для преобразования стилей с помощью JS-плагинов. Эти плагины могут сделать ваш CSS чище, поддерживать переменные и примеси, преобразовывать будущий синтаксис CSS, встроенные изображения и многое другое.
  • PostCSS берет файл CSS и предоставляет API для анализа и изменения его правил (путем преобразования его вAbstract Syntax Tree). Потом,плагинС помощью этого API можно выполнять множество полезных операций, таких как автоматический поиск ошибок или вставка префиксов поставщиков.

Javscript

  • awesome-javascript-cnКитайская версия ресурсов JavaScript, в том числе: менеджеры пакетов, загрузчики, тестовые фреймворки, бегуны, QA, фреймворки и библиотеки MVC, механизмы шаблонов и т. д.
  • awesome-javascriptКоллекция потрясающих библиотек JavaScript для браузера, ресурсов и блестящих вещей.
  • standardjsРуководство по стилю JavaScript с линтером и автоматическими исправлениями кода
  • You-Dont-Know-JSСерия книг по JavaScript.@YDKJSв Твиттере.

TodoMVC

  • todomvcПомогает выбрать фреймворк MV* — приложение Todo для React.js, Ember.js, Angular и др.

date-fns

  • date-fnsСовременная служебная библиотека даты JavaScript

библиотека функций

Underscore & Lodash

  • lodash

  • underscore

  • Современная служебная библиотека JavaScript, обеспечивающая модульность, производительность и дополнительную функциональность.

Ramda

  • ramdajsПрактический функциональный Javascript

Moment

  • momentjsРазбирайте, проверяйте, манипулируйте и отображайте даты в javascript.

day.js

  • day.jsЗамена неизменяемой библиотеки даты и времени Day.js 2 КБ для Moment.js с тем же современным API

Mathjs

  • mathjsОбширная математическая библиотека JavaScript и Node.js

Polish

  • polish.jsЛегкий набор инструментов для написания стилей JavaScript

Chance

  • chancejsПомощник генератора случайных чисел для JavaScript

HTTP

Httpie

  • httpieПрямо как /aitch-tee-tee-pie/ 🥧 Современный, удобный HTTP-клиент командной строки для эпохи API. Поддержка JSON, цвета, сеансы, загрузки, плагины и многое другое.

Netdata

  • netdataМониторинг производительности в режиме реального времени

Axios

  • axiosHTTP-клиент на основе Promise для браузеров и node.js

json-server

  • json-serverПолучите полный поддельный REST API с нулевой кодировкой (серьезно) менее чем за 30 секунд

Svelte

  • svelteКибернетические усовершенствованные веб-приложения

Vite

  • viteИнструмент сборки для веб-разработки на основе собственного ESM. Это быстро.

Vue.js

  • официальный сайт vuejsVue.js — это прогрессивная, постепенно адаптируемая среда JavaScript для создания пользовательских интерфейсов в Интернете.
  • awesome-vueКураторский список отличного контента, связанного с Vue.js
  • best-resume-everБЫСТРОЕ СОЗДАНИЕ 🚀 Легко создавайте несколько красивых резюме и создавайте лучшее резюме! Сделано с Vue и LESS.
    • случайМногочисленные библиотеки компонентов vue

Библиотека компонентов

Element

  • elementКомплект пользовательского интерфейса Vue.js 2.0 для Интернета

iView

  • iviewВысококачественный инструментарий пользовательского интерфейса на основе Vue.js 2.0.

Vuetify

  • vuetifyjsСтруктура компонентов Vue

Ant Design Vue

  • antdvКомпоненты пользовательского интерфейса предприятия на основе Ant Design и Vue.

Quasar Framework

  • quasarQuasar Framework — создавайте высокопроизводительные пользовательские интерфейсы VueJS в рекордно короткие сроки

Vue Cli

  • vue cliСтандартные инструменты для разработки Vue.js

Vuex

  • vuexЦентрализованное управление состоянием для Vue.js.

vue-router

  • vue-routerОфициальный роутер для Vue.js

Weex

  • weexФреймворк для создания мобильных кроссплатформенных интерфейсов.

Nuxt

  • nuxtjsИнтуитивно понятный фреймворк Vue

React

  • reactjsДекларативная, эффективная и гибкая библиотека JavaScript для создания пользовательских интерфейсов.
  • awesome-reactКоллекция интересных вещей об экосистеме React

Библиотека компонентов

Ant Design

  • ant.designЯзык дизайна пользовательского интерфейса и библиотека пользовательского интерфейса React.

Bulma

  • bulmaСовременный CSS-фреймворк на основе Flexbox.

Material UI

  • material-uiБолее быстрая и простая веб-разработка с компонентами React. Создайте свою собственную систему дизайна или начните с Material Design.

Semantic UI

  • Semantic-UIСемантика — это структура компонентов пользовательского интерфейса, основанная на полезных принципах естественного языка.

Chakra UI

  • chakra-uiПростые, модульные и доступные компоненты пользовательского интерфейса для вашего приложения React.

React Bootstrap

Библиотека инструментов

Reactvirtualized

  • reactvirtualizedКомпоненты React эффективно отображают большие списки и табличные данные

React Select

React Beautiful DND

  • react-beautiful-dndКрасиво и легко перетаскивайте списки с помощью React

React Chrono

  • react-chronoСовременный компонент временной шкалы для React

Swr

  • swrБиблиотека React Hooks для удаленного получения данных

React Query

  • react-queryХуки для получения, кэширования и обновления асинхронных данных в React

Redux

  • redux

  • Контейнер с предсказуемым состоянием для приложений JavaScript

React Router

  • react-routerДекларативная маршрутизация в React

Create React App

  • create-react-appНастройте современное веб-приложение, выполнив одну команду.

Create React Native App

  • create-react-native-appСоздавайте приложения React Native, которые работают на iOS, Android и в Интернете.

Next.js

  • nextjsРеагировать фреймворк

Deno

Node.js

  • nodeСреда выполнения JavaScript Node.js

руководство

  • node-lessons«Обучение пакету Node.js не включает собрание»
  • awesome-nodejsВосхитительные пакеты и ресурсы Node.js
  • nodepracticesСписок лучших практик Node.js (декабрь 2020 г.)
  • cnodeСообщество узла

Набор инструментов

nodemon

  • nodemonСледите за любыми изменениями в приложении node.js и автоматически перезагружайте сервер — отлично подходит для разработки

pm2

  • pm2Менеджер производственных процессов Node.js со встроенным балансировщиком нагрузки.

...

AdminBro

  • AdminBroэто панель администратора для приложения, написанного на node.js

Cote

  • cote.jsБиблиотека Node.js для создания микросервисов с нулевой конфигурацией.

Socket.io

  • socket.ioФреймворк приложений реального времени (сервер Node.JS)

Nw

  • nwjsВызовите все модули Node.js непосредственно из DOM/WebWorker и включите новый способ написания приложений с использованием всех веб-технологий.

Straip

  • strapiNode.js Headless CMS с открытым исходным кодом позволяет легко создавать настраиваемые API.

Express

  • expressБыстрый, простой, минималистичный веб-фреймворк Node.

Koa

  • koaПромежуточное ПО Express для node.js с использованием асинхронных функций ES2017

egg

  • eggjsРожден для создания лучших корпоративных фреймворков и приложений с помощью Node.js и Koa.

Adonis

  • adonisjsФреймворк Node.js уделяет большое внимание эргономике, стабильности и уверенности разработчиков.

Nest

  • nest
  • Прогрессивная платформа Node.js для создания эффективных, масштабируемых корпоративных серверных приложений на основе TypeScript и JavaScript (ES6, ES7, ES8).

Next

  • nextjsРеагировать фреймворк

Nuxt

  • nuxtjsИнтуитивно понятный фреймворк Vue

Electron

puppeteer

Puppeteer — это библиотека Node, предоставляющая высокоуровневый API дляСоглашение об инструментах разработчикаУправляйте Chrome или Chromium. Кукловод по умолчаниюбез головыРаботает, но может быть настроен для запуска полного (безголового) Chrome или Chromium.

Богатый текстовый редактор, редактор кода

редактор форматированного текста

Simditor

  • simditorУдобный WYSIWYG-редактор

tui.editor

  • tui.editorРедактор Markdown WYSIWYG. Стандарт GFM + диаграмма и расширяемый UML

Quill

  • quilljsQuill — это современный WYSIWYG-редактор, разработанный для обеспечения совместимости и расширяемости.

Draft

  • draftjsФреймворк React для создания текстовых редакторов.

MavonEditor

  • mavonEditormavonEditor — редактор уценки на основе Vue, который поддерживает несколько функций персонализации.

Tiptap

  • tiptapРедактор форматированного текста без рендеринга для Vue.js

Vue Quill Editor

Tinymce

  • tinymce

  • TinyMCE — самый популярный в мире WYSIWYG-редактор с открытым исходным кодом. Для редактирования расширенного текста. Работает с React, Vue и Angular

Simplemde

  • simplemde

  • Простой, красивый, встраиваемый редактор JavaScript Markdown. Редактировать легко как для новичков, так и для экспертов. Имеет встроенные функции автосохранения и проверки орфографии.

Simplemde Markdown Editor

  • simplemde-markdown-editor

  • Простой, красивый, встраиваемый редактор JavaScript Markdown. Редактировать легко как для новичков, так и для экспертов. Имеет встроенные функции автосохранения и проверки орфографии.

Editor

  • editor.jsРедактор блочного стиля с чистым выводом JSON

Medium Editor

  • medium-editorКлон редактора Medium.com WYSIWYG. Используйте API contenteditable для реализации решений RTF.

редактор кода

CodeMirror

  • codemirrorРедактор кода в браузере

Monaco Editor

Сопоставление цветов пользовательского интерфейса

  • Цвет веб-защиты

  • Adobe Color

  • Китайский цвет

  • uigradients

  • palettableСоздавайте красивые цветовые палитры, используя знания миллионов дизайнеров.

  • colorsupplyyyПалитра цветов для дизайнеров и иллюстраторов

  • webgradients— это бесплатная коллекция из 180 линейных градиентов, которые вы можете использовать в качестве фона контента для любой части вашего сайта. Легко копируйте кросс-браузерный код CSS3

  • colrdСоздавайте цветное вдохновение и делитесь им со всем миром.

  • таблица цветовОбщая таблица соответствия цветов веб-дизайна

Проект управления фоном

Vue-Element-Admin

  • vue-element-adminэто бэкэнд-интерфейс, основанный на реализации vue и element-ui.

iview-admin

  • iView AdminОн основан на Vue.js, используется сiView UIНабор внутренних интеграционных решений, сформированных библиотекой компонентов, разработанных и поддерживаемых некоторыми членами группы визуализации внешнего интерфейса TalkingData.

ant-design-pro

  • ant-design-proИспользуйте Ant Design как профессионал!

  • Готовое решение для интерфейса/дизайна среднего уровня.

vue-admin-beautiful

  • vue-admin-beautiful
  • vue3, vue3.0, vue, vue3.x, vue.js, фоновое управление, администратор, vue-admin, vue-element-admin, основная версия основана на element-plus, element-ui, ant-design-vue Параллельная разработка и обслуживание, поддержка компьютера, мобильного телефона, планшета, переключение разделов для просмотра различных версий vue, выпущена версия element-plus (vue3, vue3.0, vue, vue3.x, vue.js)

antd-admin

antd-adminОтличное фронтенд-решение для корпоративных приложений на базе Ant Design и UmiJS.

AdminLTE

  • AdminLTEAdminLTE — бесплатный шаблон панели администратора на основе Bootstrap 4

Tabler

  • tablerTabler — это бесплатный набор пользовательского интерфейса HTML Dashboard с открытым исходным кодом, созданный на основе Bootstrap.

ГИС и БИМ

cesium

  • официальный сайт цезия
  • CesiumЭто обычная библиотека для трехмерной географической визуализации, которая очень часто используется в крупномасштабной визуализации (рельеф, архитектура, земля).

Leaflet

  • LeafletЭто самая известная библиотека визуализации карт с открытым исходным кодом, небольшая по размеру, понятная по структуре и простая в использовании.
  • Библиотека JavaScript для интерактивных карт для мобильных устройств

mapbox

  • официальный сайт мапбокса
  • Mapbox GL JSЭто новейшая библиотека интерфейсных карт с впечатляющим сжатием векторов, динамическим стилем и 3D-производительностью. Он сам по себе имеет открытый исходный код, но обычно использует сервис базовых карт, предоставляемый Mapbox.
  • Mapbox.jsЯвляется расширением для Leaflet (отличается от Mapbox GL JS).

ArcGIS

  • ArcGIS API for JSЭто более академическая интерфейсная библиотека карт, которая является частью комплекта разработки ArcGIS и лучше взаимодействует с настольным и серверным программным обеспечением ArcGIS. Это не открытый исходный код, и плата не низкая, и он чаще используется в академических сценариях.

Openlayers

  • OpenlayersЭто также широко используемая внешняя библиотека карт с открытым исходным кодом, более сложная и полная, чем Leaflet.

Карта Baidu JS / Карта Baidu GL

  • JS-API карты Baiduпредставляет собой традиционную двухмерную карту,API карт Baidu GLпредставляют собой трехмерные карты, и они полагаются на фоновые сервисы, предоставляемые Baidu Maps. В дополнение к картографическим сервисам существуют сопутствующие сервисы, такие как поиск, навигация и трафик в реальном времени. У разработчиков есть бесплатные квоты.

Карта Гаоде JS

Google Maps JS

AntV L7

  • AntV L7Это библиотека визуализации пространственных данных, которая может совместно создавать визуализации карт с помощью AutoNavi Maps и т. д.

команда

GIT

husky

  • husky
  • Git hooks — это просто 🐶 Weft! хук перед фиксацией

Pre Commit

  • pre-commit

  • Автоматически установите скрипт git pre-commit в репозиторий git, который запускает ваш pre-commitnpm test

lint-staged

  • lint-stagedзапускать линтеры в промежуточных файлах git

Plop

  • Консистенция — это просто

  • Plop— это небольшой инструмент, который экономит ваше время и помогает вашей команде последовательно создавать новые файлы.

hyper

  • hyperТерминал на основе веб-технологий

Rocket.Chat

  • rocket.chat/Лучшее бесплатное решение с открытым исходным кодом для командного общения.

генератор статических сайтов

  • Генератор статических сайтов (SSG, Static Site Generator) относится к инструменту, который может генерировать набор файлов HTML, CSS и JS для быстрого развертывания на веб-сервере без установки и настройки базы данных.
  • Статические веб-сайты быстрые, стабильные и простые в обслуживании.

Gatsby

  • GatsbyСоздавайте быстрые современные приложения и веб-сайты с помощью React

react-static

  • react-staticПрогрессивный генератор статических сайтов для React.

Hexo

  • hexoБыстрая, простая и мощная платформа для ведения блогов на базе Node.js.

VuePress

  • VuePress📝 Минималистичный генератор статических веб-сайтов на базе Vue

Docusaurus

  • docusaurusПростой в обслуживании сайт документации с открытым исходным кодом.

Docsify

  • docsifyУдивительный конструктор сайтов с документацией.

Инструменты разработки API

Hoppscotch

  • hoppscotch

  • Бесплатный, быстрый и красивый конструктор запросов API, которым пользуются более 100 000 разработчиков.

  • Hoppscotch на самом деле Postwoman, который написан на основе nodejs, Его основные функции включают GraphQL и WebSocket в дополнение к поддержке основной отладки интерфейса Restful.

Postman

  • postman
  • Postman — это платформа для совместной разработки API. Функции Postman упрощают каждый шаг создания API и упрощают совместную работу, поэтому вы можете быстрее создавать более качественные API.

спецификация кода

ESLint

  • ESLintНайдите и исправьте ошибки в коде JavaScript.

Prettier

  • Prettierявляется самоуверенным форматировщиком кода.

Инструменты сборки: Инструменты сборки

Parcel

  • parcelБыстрый сборщик веб-приложений без настройки

  • ParcelНе только предоставляет различные функции, необходимые для современной фронтенд-разработки, но и имеет сокрушительное преимущество: нулевая конфигурация! В этом разница между ним и полагающимися на большое количество "загрузчиков"Webpackсамая большая разница.

Webpack

  • webpack
  • Бандлер для javascript и друзей. Упакуйте множество модулей в несколько связанных ресурсов. Разделение кода позволяет загружать части приложения по требованию. С «загрузчиками» модулями могут быть модули CommonJ, AMD, ES6, CSS, изображения, JSON, Coffeescript, LESS и т. д.

Gulp

  • gulp

  • Набор инструментов для автоматизации и улучшения вашего рабочего процесса

Rollup

  • rollupjs

  • Упаковщик модулей ES следующего поколения

тестовая среда

Jest

  • jestjs

  • Восхитительное тестирование JavaScript.

AVA

  • ava
  • Средство запуска тестов Node.js для уверенной разработки

Cypress

  • cypressБыстрое, простое и надежное тестирование всего, что работает в вашем браузере.

Puppeteer

  • PuppeteerБезголовый Chrome Node.js API

IDE и редакторы

Интегрированная среда разработки (IDE, Integrated Development Environment) — это приложение, используемое для обеспечения среды разработки программ, обычно включающее редактор кода,переводчик,Отладчики инструменты с графическим интерфейсом. Это интегрированный пакет услуг программного обеспечения для разработки, который объединяет функции написания кода, функции анализа, функции компиляции и функции отладки. Все программное обеспечение или программные комплексы (группы) с этой функцией можно назвать интегрированными средами разработки. какМайкрософтСерия Visual Studio, Borland C++ Builder, серия Delphi и т. д. Программа может работать независимо или в сочетании с другими программами. IDE в основном используются для разработки HTML-приложений.

VS Code

Atom

  • Atom
  • Взламываемый текстовый редактор

Sublime

  • sublime
  • Сложный текстовый редактор для кода, разметки и прозы

инструмент для сборки

TypeScript

  • typescriptTypeScript — это надмножество JavaScript, которое компилируется для очистки вывода JavaScript.

Flow

  • flowДобавьте статическую типизацию в JavaScript, чтобы повысить производительность разработчиков и качество кода.

Babel

  • babelBabel — это компилятор для написания следующего поколения JavaScript.

Иконка, библиотека шрифтов

библиотека иконок

Iconfont

  • iconfontБиблиотека векторных иконок Alibaba

Material Design icons

  • Material Design iconsЗначок Google Material Design, который также включает предварительный просмотр цветовой палитры.

IcoMoon

  • IcoMoonбесплатные векторные иконки

Orion

  • OrionБесплатные векторные иконки SVG

Font Awesome

  • fontawesomeНабор инструментов Iconic SVG, шрифтов и CSS

SuperTinyIcons

  • SuperTinyIconsКаждый меньше 1 КБ! Super Tiny Icons — это крошечные SVG-версии ваших любимых логотипов веб-сайтов и приложений.

Feather

  • featherПростые и красивые иконки с открытым исходным кодом

Zondicons

  • zondiconsНабор бесплатных иконок SVG премиум-класса для использования в цифровых продуктах.

Ionicons

  • ioniconsИконки премиум-класса ручной работы от Ionic для приложений Ionic и веб-приложений по всему миру.

Maki

  • MakiНабор иконок пои
  • Maki — это набор иконок, разработанный для дизайнеров карт. Maki включает значки для общих достопримечательностей, таких как парки, музеи и места отправления культа. Каждая иконка доступна в формате SVG и бывает двух размеров: 11 x 11 пикселей и 15 x 15 пикселей.

шрифт

Google Fonts

Free Fonts

Библиотека CSS-анимации

  • Выбраны некоторые библиотеки анимации, которые поддерживались в прошлом году.

Keyframes

  • keyframesKeyframes поможет вам написать лучшие CSS

Spinkit

  • spinkitИндикатор нагрузки производства с анимацией CSS

Animate.css

  • animate
  • Animate.css— это готовая кроссбраузерная библиотека анимации для использования в ваших веб-проектах. Отлично подходит для акцентов, домашних страниц, слайдеров и подсказок для привлечения внимания.

Anime

  • animeДвижок анимации JavaScript

Svg

  • svgjsЛегкая библиотека для управления и анимации SVG.

Snap

  • snapsvgБиблиотека JavaScript для современной графики SVG.

Dynamics

  • dynamicsjsDynamics.js — это библиотека JavaScript для создания анимации на основе физики.

Three

  • three.js3D-библиотека JavaScript

ScrollReveal

  • scrollrevealjsАнимируйте элемент, когда он прокручивается в поле зрения.

GSAP

  • GSAPАнимация JavaScript профессионального уровня для современного Интернета

Magic

  • magicАнимация CSS3 со спецэффектами

Pixi

  • pixi.jsМеханизм создания HTML5: создавайте красивый цифровой контент с помощью самого быстрого и гибкого средства визуализации 2D WebGL.

Tween

  • tween.jsДвижок анимации JavaScript

ScrollTrigger

  • ScrollTriggerСделайте так, чтобы ваша страница реагировала на изменения прокрутки.

Parallax

  • parallax

  • Механизм параллакса, реагирующий на ориентацию смарт-устройства

  • Красиво, но давно не ремонтировалось

Matter

Файл загружен

Uppy

  • uppy

  • Следующий загрузчик файлов с открытым исходным кодом для веб-браузеров

FileSaver

  • filesaverРеализация HTML5 saveAs() FileSaver

Filepond

  • filepondГибкая и интересная библиотека загрузки файлов JavaScript

React Dropzone

  • react-dropzoneПростая зона сброса HTML5 с использованием React.js.

UI

Layui

  • layuiФреймворк пользовательского интерфейса, написанный по собственной спецификации модуля, следует форме написания собственного HTML/CSS/JS с очень низким порогом, и его можно использовать немедленно.

Styled Components

  • styled-componentsДиаграмма видения возраста компонента. Легко задайте стиль приложения, используя лучшие возможности ES6 и CSS.

Tailwindcss

  • tailwindcssПервая в мире CSS-инфраструктура для быстрой разработки пользовательского интерфейса.

Storybook

  • storybookБраузер компонентов пользовательского интерфейса. Разрабатывайте, документируйте и тестируйте React, Vue, Angular, Ember, веб-компоненты и многое другое!

Ionicframework

  • ionicframework

  • Мощный кроссплатформенный набор инструментов пользовательского интерфейса для создания iOS, Android и прогрессивных веб-приложений нативного качества с использованием HTML, CSS и JavaScript.

Material Design Lite

  • getmdlКомпоненты материального дизайна в HTML/CSS/JS

Reveal.js

  • revealjsпредставляет собой среду представления HTML с открытым исходным кодом. Это инструмент, который позволяет любому, у кого есть веб-браузер, бесплатно создавать полнофункциональные и красивые презентации.

Headlessui

  • headlessuiПолностью не стилизованные, полностью доступные компоненты пользовательского интерфейса, разработанные для идеальной интеграции с Tailwind CSS.

Диаграммы, Визуализация данных

Chart

  • chartjsиспользовать<canvas>Простая диаграмма HTML5 с тегами

D3

  • d3Оживите данные с помощью SVG, Canvas и HTML.

Incubator Superset

  • superset.incubatorApache Superset — это платформа визуализации и исследования данных.

echarts

  • echartsApache ECharts (incubating) — мощная интерактивная библиотека построения диаграмм и визуализации данных для браузера.

Движущийся конец

uni-app

  • uni-appЭто унифицированная платформа для разработки небольших программ, H5 и приложений с использованием синтаксиса Vue.

weex

Create React Native App

Flutter

MPVue

  • mpvueСреда разработки апплетов на основе Vue.js уже давно поддерживает синтаксис Vue.js и встроенную систему инструментов.

Taro

  • taro

  • Открытое кросс-платформенное решение, поддерживающее использование таких платформ, как Camp/Vue/NERV, для разработки таких приложений, как WeChat/JD.com/Baidu/Alipay/ByteDance/QQ applet/H5.

Lottie Web

  • lottie-webВизуализируйте анимацию After Effects изначально в Интернете, на Android и iOS, а также в React Native.

DiscreteScrollView

  • DiscreteScrollView

  • Прокручиваемый список элементов, центрированный на текущем элементе, с простым в использовании API (для классной анимации элементов).

Android-SpinKit

React Native Elements

React Native Firebase

  • react-native-firebase
  • Протестирована многофункциональная модульная реализация Firebase для React Native. Платформы iOS и Android поддерживаются для всех сервисов Firebase.

React Native Snap Carousel

  • react-native-snap-carousel
  • Компонент слайдера/карусели для React Native с предварительным просмотром, несколькими макетами, параллаксными изображениями, высокопроизводительной обработкой большого количества элементов и многим другим. Совместимость с Android и iOS.

React Native Calendars

Joplin

  • joplin
  • Joplin — открытое приложение для создания заметок и дел с синхронизацией для Windows, macOS, Linux, Android и iOS.

Appium

  • appium📱 Автоматизация для приложений iOS, Android и Windows.

NativeBase

  • NativeBaseОсновные кроссплатформенные компоненты пользовательского интерфейса для React Native

Framework7

  • framework7Полнофункциональный HTML-фреймворк для создания приложений для iOS и Android.

Плагин VSCode

  • В частности, вы можете увидетьCRPERВ статьях VSCode Nuggets, начиная с первой статьи, всего пятнадцать статей, вот некоторые из использованных.

  • VS Code Toss - (1) Ерунда

vue

React

Апплет WeChat

  • mpvue snippets: mpvueНекоторые фрагменты кода и подсказки по коду для некоторых нативных апплетов
  • minapp: использоватьVS CodeНеобходимый плагин для написания небольших программ, в нем много практических интеграций функций

проверка кода

  • Jest: давай ты пишешьJestКод похож на IDE
  • Mocha Test Explorer: заmochaЕсли графический интерфейс протестирован, он предоставит редактору отдельный раздел.
  • Coverage Gutters: Область, в которой вы можете визуально увидеть покрытие вашего кода.

Улучшения визуализации кода

  • Polacode: Создавайте красивые скриншоты кода, очень красивые, сгенерированные в соответствии с цветовым соответствием вашей текущей темы.
  • vscode-pigments: кодовая страница отображает цветовой код и отображает соответствующий цвет, что очень практично.
  • Json Editor: очень полезная визуализацияJSONРедактируйте, чтобы не пропустить
  • Subtle Match Brackets: быстро выделить закрытие вашей конфигурации, полезно для фокусировки нашего кода блока курсора
  • vscode-live-server: очень полный инструмент предварительного просмотра HTML, который поддерживает множество функций, необходимых для фактической разработки, таких какhttps,代理,cros

формат

  • prettier
  • ESLint
  • Prettier ESLint

тема

грязные инструменты

Epic Spinners

  • epic-spinnersКоллекция простых в использовании счетчиков CSS, интегрированных с Vue.js.

Nprogress

  • nprogressТонкий индикатор выполнения для YouTube, Medium и др.

Nodemailer

  • nodemailerОтправка электронных писем с помощью Node.JS — это проще простого!

Driver

  • driverЛегкий, свободный от зависимостей необработанный движок JavaScript, который привлекает внимание пользователя на странице.

Dayjs

  • dayjsЗамена неизменяемой библиотеки даты и времени Day.js 2 КБ для Moment.js с тем же современным API

Glider

  • glider.jsБыстрая, легкая, независимая альтернатива нативным каруселям с прокруткой!

Mockjs

  • mockГенератор фиктивных данных

Faker

  • faker.jsСоздавайте огромные объемы реалистичных поддельных данных в Node.js и браузере.

Sailsjs

  • sailsjsФреймворк MVC в реальном времени для Node.js

Swiper

  • swiperСамый современный мобильный сенсорный слайдер с аппаратным ускорением переходов.

fullPage полноэкранная прокрутка

  • fullPageПолностраничный плагин Альваро Триго. Быстро и легко создать полноэкранную страницу

screenfull.js на весь экран

  • screenfullПростая оболочка для кросс-браузерного использования полноэкранного API JavaScript.

Скриншот html2canvas

  • html2canvasСкриншот с использованием JavaScript

Подсветка кода призмы

  • prismЛегкая, надежная и элегантная подсветка синтаксиса.

Драггабилли

  • draggabillyсделать элемент перетаскиваемым

Modernizr

  • modernizrModernizr — это библиотека JavaScript, которая обнаруживает возможности HTML5 и CSS3 в браузере пользователя.

html5-шаблон шаблона

  • html5-boilerplateПрофессиональные интерфейсные шаблоны для создания быстрых, надежных и адаптируемых веб-приложений или веб-сайтов.

Magic Of Css

  • magic-of-cssКурсы CSS, которые сделают из вас волшебника.

Odometer

  • odometerЛегко и плавно переходить номера

Протонные частицы

  • protonБиблиотека анимации частиц Javascript

частицы частиць.js

  • particleЛегкая библиотека JavaScript для создания частиц

ParticleEffectsButtons

  • ParticleEffectsButtonsНебольшая библиотека для эффектов разрыва частиц на кнопках и других элементах.

Холст Fabric.js

  • fabric
  • Hyperledger Fabric — это платформа корпоративного распределенного реестра с разрешениями для разработки решений и приложений. Его модульная и универсальная конструкция подходит для широкого спектра отраслевых вариантов использования. Он предоставляет уникальный метод консенсуса, который обеспечивает масштабируемую производительность при сохранении конфиденциальности.

Sortable

  • SortableСоздавайте и изменяйте порядок списков, перетаскивая их. Работает с современными браузерами и сенсорными устройствами

jsPDF

  • jsPDFГенерация PDF на стороне клиента на JavaScript для всех.

Video

  • videojs
  • Video.js — HTML5 и Flash Video Player с открытым исходным кодом

Better Scroll

  • better-scrollВдохновленный iscroll, он поддерживает больше функций и имеет лучшую производительность прокрутки.

PDF

  • pdf

  • Читатель PDF на JavaScript

Clipboard

  • clipboardjs

  • Современная копия в буфер обмена. Нет вспышки. Всего 3кб после сжатия📋

Nylas Mail

  • nylas-mail
  • Современное веб-масштабируемое настольное почтовое приложение. Вилки приветствуются!

Sheet

  • sheetjsSheetJS Community Edition — набор инструментов для работы с электронными таблицами

React Content Loader

  • react-content-loaderКомпоненты на основе SVG упрощают создание каркасных нагрузок.

SkeletonView

  • SkeletonViewЭлегантный способ показать пользователям, что происходит, и подготовить их к тому, чего ждать

Match Sorter

  • match-sorterПростая, ожидаемая и детерминированная сортировка массивов по наилучшему совпадению в JavaScript

Luckysheet

  • Luckysheetпредставляет собой онлайн-таблицу, подобную Excel, мощную, простую в настройке и с полностью открытым исходным кодом.

GraphQL

Hasura

  • hasura

  • Postgres с детальным контролем доступа имеет быстрый, мгновенный API GraphQL в режиме реального времени, а также может запускать веб-перехватчики для событий базы данных.

Preact

  • preactjs
  • Быстрая альтернатива React размером 3 КБ с тем же современным API. Компоненты и виртуальный DOM.
  • ты сможешьудивительный списокНайдите отличные библиотеки

Realworld

  • realworld
  • «Мать всех демо-приложений» — образцовый клон Medium.com с полным стеком на базе React, Angular, Node, Django и других.

Type Fest

Edex UI

  • edex-uiКроссплатформенный, настраиваемый научно-фантастический эмулятор терминала с расширенным мониторингом и поддержкой сенсорного экрана.

Serverless

  • serverless
  • Бессерверные платформы — используйте бессерверные архитектуры для создания веб-приложений, мобильных приложений и приложений IoT с использованием AWS Lambda, Azure Functions, Google CloudFunctions и многого другого!

Meteor

  • meteorПлатформа приложений JavaScript

Snowpack

  • snowpackИнструменты сборки внешнего интерфейса, поддерживаемые WASM. Быстрый, легкий, без пакетов ESM. ✌️

Headless Recorder

  • headless-recorderHeadless Recorder — это расширение Chrome, которое записывает ваши действия в браузере и генерирует сценарии марионеток или playbook.

.gitignore

  • gitignoreКоллекция полезных шаблонов .gitignore

Cheatsheets

LightHouse

  • Lighthouse — это инструмент автоматизации с открытым исходным кодом для улучшения качества сетевых приложений.

  • Его можно запустить как расширение Chrome или из командной строки.

Can I Use

  • caniuseНеобработанные данные о поддержке браузера/функций с сайта caniuse.com.

Carbon

  • CarbonСоздавайте и делитесь красивыми изображениями исходного кода

ios font

  • ios font

  • Запрос поддержки шрифтов IOS и встроенный запрос шрифтов системы IOS.

TinyPNG

  • TinyPNG

  • Онлайн-инструмент сжатия изображений PNG / JPG, интеллектуальное сжатие изображений PNG и JPEG.

  • TinyPNG использует интеллектуальную технологию сжатия с потерями для уменьшения размера файлов PNG. Благодаря выборочному уменьшению цветов изображения для сохранения данных требуется всего несколько байтов. Визуальное воздействие почти незаметно, но разница в размере файла очень большая.

Shape Divider

  • Shape Divider

  • Инструмент для настройки разделов веб-сайта SVG различной формы.После настройки нужной формы вы можете скопировать и загрузить ее одним щелчком мыши.

формат json

  • формат json

  • Это веб-сайт онлайн-анализа json

  • Функции включают в себя: онлайн-анализ json, форматирование json, проверку формата json, преобразование json в xml, преобразование xml в json, сжатие json, экранирование json, обфускацию и шифрование js, преобразование JSON в объект, онлайн-обработку json и проверку JSON.

FeHelper

sojson

  • sojsonЭто невероятно универсальный сайт!

Docz

  • doczДокументирование ваших вещей никогда не было проще!

Инструмент обнаружения ошибок

  • Fundebug
  • vue-devtoolsРасширение devtools для браузера для отладки приложений Vue.js.
  • redux-devtools-extensionРасширение Redux DevTools.
  • react-native-debuggerАвтономное приложение на основе официального отладчика React Native, включая React Inspector/Redux DevTools.
  • ndb— это улучшенный процесс отладки для Node.js на базе Chrome DevTools.
  • debugКрошечная утилита отладки JavaScript, которая эмулирует основные методы отладки Node.js. Доступно в Node.js и веб-браузерах
  • wproxyHTTP, HTTP2, HTTPS, прокси-сервер отладки Websocket
  • spy-debuggerОтладка Wechat, отладка различных стилей WebView, отладка реальных машин страниц мобильного браузера. Удобная мобильная страница удаленной отладки, инструмент захвата пакетов, поддержка: HTTP/HTTPS, нет необходимости в USB-устройстве для подключения.

онлайн редактирование

  • jsbinСовместное приложение для отладки JavaScript
  • Codepen

Отличный веб-сайт в стране и за рубежом

одомашненный

иностранный

Отличное руководство по интерфейсу на GitHub

  • frontendchecklistИдеальный контрольный список интерфейса для современных веб-сайтов и дотошных разработчиков
  • front-end-interview-handbookСерьезные ответы на знаменитые «вопросы на собеседовании перед началом работы» h5bp
  • tech-interview-handbookМатериалы, которые помогут вам пройти следующее собеседование по программированию
  • Daily-Interview-QuestionУ меня каждый день по будням есть вопрос на собеседовании на крупную фабрику, я оглянусь назад через год и поблагодарю себя за свою тяжелую работу!
  • Ресурсы по дизайну для разработчиковКураторский список ресурсов дизайна и пользовательского интерфейса из стоковых фотографий, веб-шаблонов, фреймворков CSS, библиотек пользовательского интерфейса, инструментов и многого другого.
  • javascriptРуководство по стилю JavaScript
  • JavascriptРепозиторий всех алгоритмов, реализованных в Javascript (только для образовательных целей)
  • алгоритм javascriptАлгоритмы и структуры данных, реализованные в JavaScript, с пояснениями и ссылками для дальнейшего чтения
  • learn-javascriptGitBook Обучение основам программирования с использованием Javascript
  • JavaScript questionsДлинный список (расширенных) вопросов по JavaScript и их пояснения
  • clean-code-javascriptКонцепции чистого кода для JavaScript
  • javascript3030-дневный JS-вызов
  • 33-js-concepts33 концепции, которые должен знать каждый разработчик JavaScript.
  • fccБаза открытого исходного кода FCC China и курсы. Учитесь программировать и помогайте некоммерческим организациям.
  • awesome-interview-questionsКураторский список вопросов для интервью. Не стесняйтесь вносить свой вклад!
  • leetcode-solutionРешения LeetCode: отчет о моем путешествии по решению проблем ( решение проблем с leetcode, запись вашего собственного пути решения проблем с leetcode.
  • project-based-learningКураторский список руководств на основе проектов
  • free-programming-books-zh_CNБесплатные китайские книги по компьютерному программированию, добро пожаловать!
  • You-Dont-Know-JSСерия книг по JavaScript.@YDKJSв Твиттере.
  • freecodecampБаза исходного кода и учебная программа FreeCodeCamp.org с открытым исходным кодом. Учитесь программировать дома.
  • javascript-patternsРежим JavaScript
  • project-guidelinesЛучшие практики для набора проектов JavaScript
  • Блог Сае ЮВ настоящее время Ю Ю написал четыре серии: углубленная серия по JavaScript, тематическая серия по JavaScript, серия по ES6 и серия по React.
  • шпаргалка по современному jsШпаргалка по знанию JavaScript, часто встречающаяся в современных проектах.
  • fe-interviewПредварительное собеседование — это 3+1 каждый день, вопросы интервью используются для стимулирования обучения, продвижения ежедневного обучения и размышлений и достижения прогресса каждый день!
  • reactjs-interview-questionsСписок 500 лучших вопросов и ответов на собеседованиях по ReactJS... Скоро появятся вопросы по практике кодирования! !
  • 30-seconds-of-interviewsПодборка распространенных вопросов для интервью, которые помогут вам подготовиться к следующему собеседованию.
  • hiring-without-whiteboardsКомпании с непрерывным процессом найма
  • awesomeПотрясающий список на разные интересные темы
  • AndroidInterview-Q-AЛучшие интернет-компании Android Интервью Вопросы и ответы
Категории