m-fil/rslang

RS Lang

Ccылка не деплой: https://rslang-team18-m-fil.netlify.app/

Возможно ли изучать английский язык не в формате привычных скучных уроков? Однозначно - да. Для этого и предназначено данное приложение. Благодаря методам и формам приложения, изучать английский язык становится весело и интересно. Наши игры помогут Вам с лёгкостью выучить слова, а статистика покажет Ваш прогресс.

Краткое содержание

• Приступая к работе
• Требования
• Установка
• Deployment
• Коллабораторы
• Задействованные библиотеки и технологии

Приступая к работе

Эти инструкции помогут вам получить копию проекта и запустить его на локальном компьютере для целей разработки и тестирования. Читайте ниже для получения подробной информации.

Требования

1. Система контроля версий GIT. Установить ее можно здесь.
2. Для тестирования и запуска проекта вам понадобится Node package manager(NPM). Для его использования нужно установить Node.js.

Установка

1. Если вы уже установили GIT, то откройте консоль с помощью IDE либо стандартной консоли на вашем устройстве и склонируйте проект с помощью простой команды git clone https://github.com/M-fil/rslang.git. Все файлы проекта склонируются в папку под названием rslang.
2. Затем нужно перейти в склонированную папку rslang.
3. Когда вы перешли в папку rslang, то для того, чтобы запустить проект и начать пользоваться им вам нужно установить все npm-пакеты, которые используются в проекте. Для этого напишите в консоли команду npm install и дождитесь конца загрузки. Если загрузка не начинается, убедитесь, что вы установили Node.js.
4. После того, как загрузка npm-пакетов завершилась, можно запускать проект. Для этого нужно ввести команду npm start, которая запустит локальный сервер. Список других команд можно найти в файле package.json.

Deployment

Для того, чтобы собрать проект, нужно ввести команду npm run prod, которая заранее прописана в package.json файле.

Коллабораторы

• Максим Филанович
• Максим Антонов
• Кирилл Жданов
• Антон Андреев
• Екатерина Латушкина
• Евгений Шныркевич

Задействованные библиотеки и технологии

1. Chart.js

Библиотека Chart.js - популярный инструмент, который предназначен для создания графиков и диаграмм. С помощью данной библиотеки были разработаны круговые и линейные диаграммы для страницы "Долгосрочная Статистика". Преимуществами Chart.js являются:

• 8 типов графиков и диаграмм: линейный (Line), линейный с областями (Area), линейчатый (Bar), круговой (Pie), лепестковый «Радар» (Radar), полярный (Polar), пузырьковый (Bubble) и точечная диаграмма рассеивания (Scatter).
• Все типы графиков можно кастомизировать и снабдить анимацией, и все они адаптивны при работе в сети.
• Функциональность может быть расширена посредством использования плагинов.

Из недостатков можно выделить следующее:

• библиотека дает возможность создавать только основные базовые типы диаграмм. Для более сложных форм нужно будет подбирать другие инструменты.

2. Eslint Airbnb's base config

ESLint - это линтер для языка программирования JavaScript, написанный на Node.js. В проекте он был использован для поддержки читстоты кода и обнаружнения ошибок. Инструмент Eslint предоставляет множество преимуществ для разработчиков. Из его плюсов можно выделить

• Гибкость: любое правило может быть переключено, и во многих правилах есть дополнительные настройки, которые можно настроить Очень расширяемый и доступно много плагинов.
• Легко понять результат
• Включает множество правил, недоступных для других линтеров, что делает ESLint более полезным при выявлении проблем
• Лучшая из возможных поддержка ES6, а также единственный инструмент для поддержки JSX
• Поддержка пользовательских репортеров

Недостатки Eslint:

• Требуется некоторая конфигурация

3. Webpack

Webpack - инструмент, который использовался в проекте для сборки модулей в единый JS-файл. Плюсы Webpack:

• Генерация нескольких файлов (в т.ч. содержащих по несколько модулей сразу)
• Динамическая подгрузка файлов
• Масса плагинов для обработки кода
• Динамическое обновление кода во время его работы без потери состояния программы

Минусы:

• сложная документация
• Требуется конфигурация

4. Babel

Babel - это бесплатный JavaScript-транскомпилятор с открытым исходным кодом, который в основном используется для преобразования кода ECMAScript 2015+ в обратно совместимую версию JavaScript, которая может быть запущена более старыми механизмами JavaScript. В проекте были использованы некоторые плагины этого инструмента, среди которых @babel/polyfill, позволяющий эмулировать полную среду ES2015+. Преимущества Babel:

• BabelJS обеспечивает обратную совместимость со всеми новыми функциями JavaScript и может использоваться в любых браузерах.
• У BabelJS есть возможность перейти на следующую версию JavaScript — ES6, ES7, ESNext и т. Д.
• BabelJS может использоваться вместе с gulp, webpack, flow и т.д. Что делает его очень мощным и может использоваться в большом проекте, облегчающем жизнь разработчика.
• BabelJS также работает с реагирующим синтаксисом JSX и может быть скомпилирован в форме JSX.
• BabelJS поддерживает плагины, полифилы, babel-cli, что облегчает работу с большими проектами.

Недостатки:

• Код BabelJS изменяет синтаксис при переносе, что затрудняет понимание кода при выпуске в производство.
• Переданный код имеет больший размер по сравнению с исходным кодом.
• Не все ES6 / 7/8 или будущие новые функции могут быть перенесены, и мы должны использовать polyfill, чтобы он работал в старых браузерах.