Coder Social home page Coder Social logo

barbagrigia / js-stack-from-scratch Goto Github PK

View Code? Open in Web Editor NEW

This project forked from usulpro/js-stack-from-scratch

0.0 2.0 0.0 1.07 MB

🌺 Russian translation of "JavaScript Stack from Scratch" from the React-Theming developers https://github.com/sm-react/react-theming

JavaScript 100.00%

js-stack-from-scratch's Introduction

Стек технологий JavaScript с нуля

JavaScript Stack from Scratch

Build Status Join the chat at https://gitter.im/js-stack-from-scratch/Lobby

Yarn React Gulp Redux ESLint Webpack Mocha Chai Flow

Это русскоязычная версия руководства Джонатана Верекии (@verekia). Оригинальное руководство расположено здесь. Данное пособие постоянно развивается и дополняется автором, предоставляя читателям максимально свежую и качественную информацию. Текст оригинального пособия и прилагаемый код будут меняться с течением времени. Мы так же будем стараться поддерживать русскоязычную версию в актуальном состоянии. Данный перевод соответствует английской версии по состоянию на commit. Мы будем рады вашим замечаниям и вопросам

Добро пожаловать в мое современное руководство по стеку технологий JavaScript: Стек технологий JavaScript с нуля

Это минималистичное и практико-ориентированное пособие по применению JavaScript технологий. Вам потребуются общие знания по программированию и основы JavaScript. Это пособие нацелено на интеграцию необходимых инструментов и предоставляет максимально простые примеры для каждого инструмента. Вы можете рассматривать данный документ, как возможность создать свой собственный шаблонный проект с нуля.

Конечно, вам не нужны все эти технологии, если вы делаете простую веб страницу с парой JS функций (комбинации Browserify / Webpack + Babel + jQuery достаточно, чтобы написать ES6 код в нескольких файлах и скомпилировать все через командную строку), но если вы собираетесь создать масштабируемое веб приложение, и вам нужно все правильно настроить, то это руководство отлично вам подходит.

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

В большой части технологий, описываемых здесь, используется React. Если вы только начинаете использовать React и просто хотите изучить его, то create-react-app поможет вам и кратко ознакомит с инфраструктурой React на основе предустановленной конфигурации. Я бы, например, порекомендовал такой подход для тех, кому нужно влиться в команду, использующую React, и на чем-то потренироваться, чтобы подтянуть свои знания. В этом руководстве мы не будем пользоваться предустановленными конфигурациями, поскольку я хочу, чтобы вы полностью понимали все, что происходит "под капотом".

Примеры кода имеются в каждой части, и вы можете запускать их через yarn && yarn start или npm install && npm start. Я рекомендую писать все с нуля самостоятельно, следуя пошаговым инструкциям каждого раздела.

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

Примечание: Порядок частей не всегда обязателен. К примеру, тестирование / типизация могут быть выполнены до введения в React. Довольно сложно перемещать или редактировать опубликованные разделы, поскольку приходится вносить изменения во все следующие за ними части. Возможно, когда все определится, я приведу всю документацию к более удобному виду.

Код, приведенный в примерах, работает под Linux, macOS и Windows.

Содержание

1 - Node, NPM, Yarn и package.json

2 - Установка и использование пакетов

3 - Настройка ES6 с Babel и Gulp

4 - Использование ES6 классов

5 - Синтаксис модулей ES6

6 - ESLint

7 - Клиентское приложение на основе Webpack

8 - React

9 - Redux

10 - Immutable JS и улучшения Redux

11 - Тестирование с Mocha, Chai и Sinon

12 - Типизация с Flow

Далее планируется:

Production / development окружение, Express, React Router, Серверный Рендеринг, Стилизация, Enzyme, Приемы Git.

Переводы на другие языки

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

Сведения

Создано @verekiaverekia.com.

Переведено @usulpro - react-theming

Лицензия: MIT

js-stack-from-scratch's People

Contributors

verekia avatar usulpro avatar dalikat avatar saniko avatar fbertone avatar vadimbogomazov avatar kulte avatar sherevv avatar rouzazari avatar piperchester avatar eswat avatar peterchon avatar kevin-xi avatar jakeniemiec avatar felixsanz avatar grabes avatar arthur-zhuk avatar radarhere avatar

Watchers

James Cloos avatar Vlad Trukhin avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.