Курс по JavaScript with React JS

Кратко представяне на езика за програмиране JavaScript:

JavaScript е интерпретиран език за програмиране, разпространяван с повечето Уеб браузъри. Поддържа обектно-ориентиран и функционален стил на програмиране.Най-често се прилага към HTML-а на Интернет страница с цел добавяне на функционалност изареждане на данни. Може да се ползва също за писане на сървърни скриптове NodeJS, както и за много други приложения.

Цел на курса по JavaScript- Advanced with React:

Курсът по JavaScript – Advanced е продължение на JavaScript – Basic курса, като засяга по-задълбочени материaли. Курсистите ще бъдат запознати с по-напреднали техники, технологии и инструменти за автоматизация. Голяма част от занятията ще включват практически задачи, в които курсистите ще трябва да разработят сами (с помощ от лектора) приложения по предварително поставено задание.

За кого е предназначен курсът:

Препоръчително е курсистите да имат завършен курса по JavaScript – Basic, или да имат основни познания по HTML, CSS и JavaScript – синтаксис, типове данни, функции, DOM манипулации и AJAX.

Мащаб на групата:

С цел по-ефективно обучение, групите са ограничени до 8 курсиста.

Издаване на Сертификат:

Степента на справяне с практичните задачи по време на обучението, домашните работи, както и финалния тест са основание за издаване на Сертификат.Разбирането на поставените задачи и справянето на курсистите с тях е от изключително значение за по-добрата им реализация след обучението.

Хостинг план:

Безлатен хостинг за всеки един курсист за целите на курса, предоставен от нашите партньори от Суперхостинг, чрез план – “СуперПро” . Повече информация – тук.

Учебна програма на курса по JavaScript with ReactJS

Хорариум ( 100 уч. часа ) :

Theme 1: Introduction

-Course intro
-About the course
-What you’ll learn
-Course github repos (slides and labs)

JavaScript (and DOM)
-Historical overview in 10 minutes (or how the history repeats itself)
-JavaScript standards: ES5, ES6, …ES2018 and ES.Next?
-The difference between JavaScript and other OOP languages
-JavaScript data types: “is everything an object”?
-DOM – overview, elements, events

Theme 2: JavaScript Essentials

-Functions and Function Expressions8
-Defining Functions
-Function Declaration vs. Function Expression vs. Function Constructor
-Scope
-Immediately-invoked function expressions (IIFE)
-Closures
-Recursion
-Factorial example
-Traversing the DOM
-Recursion with expressions
-Functional-based programming with JavaScript

OOP in JavaScript
-OOP in a nutshell
-OOP in JavaScript
-Object creation
-Object Literal (object initializer)
-Constructor Function
-The Object.create() method
-Object properties (including ES6 syntax)

Go deep into the “this” context
-“this” in global context
-“this” in function invocation context (strict or non-strict)
-“this” in method invocation context
-“this” in constructor invocation context
-“this” in call(), apply() and bind() methods

OOP – Inheritance in JavaScript6
-Classical (class-based) Inheritance vs. Prototypal Inheritance
-Classical (class-based) Inheritance in JavaScript
-Prototypal Inheritance in JavaScript
-Prototypal Inheritance – How it works?

Function as object
-The Function object
-The Function prototype object
-The arguments object
-bind(), apply(), and call() methods

Other ES6 Features
-Template literals
-New string methods
-The Arrow function syntax
-Default parameter values
-The spread operator
-Rest parameters
-Destructuring
-New object literal features
-Object.assign() method
-The Class Syntax
-The for-of loop
-New data structures (Maps, Sets, Typed Arrays)

JavaScript Exceptions
-Exceptions
-Exception handling
-Try-catch block
-Throwing exceptions
-Custom exceptions

Promises and Asynchronous Programming
-Asynchrony in JavaScript
-Callback-oriented programming?
-JS Promises
-Async/Await

Regular Expressions in JavaScript8
-Regular Expressions basis
-Regex Syntax
-Create RegExp in JavaScript
-Use RegExp in JavaScript

Theme 3:Design Patterns and Best PracticesTotal

Concise review of JavaScript Good Practices
-Naming in JavaScript
-Scoping
-Global and function
-Fake block scope
-Duplicated Object Identifiers
-Variables
-Strict mode

Design Patterns Overview. Creational Patterns
-What are design patterns?
-the Constructor Pattern
-The Factory Pattern
-The Singleton Pattern
-The Module Pattern

Member patterns
-Public/Private/Privileged – clarify the concepts.
-Private and Privileged Members – the Crockford Pattern.
-Private and Privileged Members in object prototype.

Structural Patterns
-Mixins
-Decorator
-Iterator
-Observer

Theme 4: HTTP Basics

Client-Server Communications on HTTP
-HTTP protocol overview: Request and Responde Message Formats
-HTTP Request Methods.
-The “GET” Request Method
-The “POST” Request Method
-Other HTTP Request Methods
-The concepts: IP, Port, host, DNS.
-Setting up a node.js localhost server. Look at conf and hosts file.
-Let’s code – The guts of Simple User Registration App

Web Storages
-Cookies
-SessionStorage
-LocalStorage

Theme 5: Web Services, AJAX and SPA

WebServices
-Overview
-XML vs JSON
-JSON syntax and tooling

AJAX: consuming Remote Data with JavaScript2
-XMLHttpRequest object
-A historical overview
-Creating Pure JS HTTP request through XMLHttpRequest
-Demo with jQuery Ajax
-Demo with promises
-The callback hell
-The modern way – Fetch API

Third Party APIs
-What is API?
-Backend Services REST API
-Examples
-GitHub API
-Google Maps API
-YouTube API

Single-Page Applications and Patterns2
-What is a SPA app?
-Architectural Design Patterns
-MV* patterns – MVC, MVVM and MVP
-Sample implementation in JavaScript
-An overview of the “big three” for SPA: Vue, React and Angular

Theme 6: react.js

Introduction to React
-Overview
-Setup the environment. Tooling.
-Write your first react app
-Get familiar with create-react-app cli
-Design notes on the DemoApp we’re going to build.
-Splitting our DemoApp on Components

JSX
-What is JSX and why you’d want to use it
-Embed Expressions in JSX (and JSX into JSX)
-Define Attributes with JSX
-JSX transpilitaion
-Hands on DemmoApp

React Elements
-What’s in an element
-React Elements vs DOM Elements
-React Virtual DOM
-How React updates the DOM Elements
-Hands on DemmoApp

React Components and Props
-Function and Class Components
-How a component is rendered?
-Components composition
-Props and props types
-Hands on DemmoApp

State and Lifecycle in a React component
-State in react.js
-Components Lifecycle
-Hands on DemmoApp

Events handling in React
-DOM Events and Event Bubbling
-The Event Loop
-React Event Handlers
-Async Event Handlers
-Hands on DemmoApp

Lists in react
-Arrays and lists of elements
-Basic List Component
-Keys
-Embedding map() in JSX
-Hands on DemmoApp

Forms and Authentication
-Forms management in React
-Token-based Authentication (JWT)
-Authorization, public and private pages
-Hands on DemmoApp

State Management. Flux. Redux.4
-Manage the state outside of React
-Get familiar with Flux
-Level up with Redux
-Hands on DemmoApp

Course projects discussion

График на курса по “JavaScript – Advanced with React”:

Следващите начални дати са:

17-ти юни 2023г.  (съботно-неделна форма на обучение от 14:00 до 17:00 часа, което са 4  учебни часа с 20 минути почивка).  Курсът ще се провежда всяка събота и неделя. Край на курса: 09-ти септември 2023г.

Обучението се провежда в малка бутикова група, като всеки от тях може да избира между:

• присъствена форма –  на място в учебна зала на пл. Славейков.
• или да се включи онлайн от вкъщи през нашия Zoom business account.

Цена и заплащане на курса:

Цена: 990 лв.

Има възможност за разсрочено заплащане на курсa на две вноски. Първата вноска от 500 лева се внася при записването, а втората (490 лева) в началото на втория месец от обучението.

Видео представяне на курса “JavaScript Advanced with React”

Полезни статии относно JavaScript:

8 ПОПУЛЯРНИ ПРИЛОЖЕНИЯ, РАЗБРАБОТЕНИ НА REACTJS
ТОП 9 ПРИЛОЖЕНИЯ НА JAVASCRIPT
КАКВО Е JAVASCRIPT И ТРЯБВА ЛИ ДА ГО УЧИМ?

Запиши се сега!

Допълнителни условия:

• Записването се извършва единствено по банков път, моля погледнете номера на банковата сметка по-долу.

Номер на банкова сметка:
IBAN:BG49CECB979010E2257300
BIC:CECBBGSF
Получател: Прогрес 2013 ЕООД
Основание за плащане: наименованието на записания курс и началната дата на обучението
(например – Курс по Java от 15.10.22г. )

Изпратете ни платежното нареждане ( снимано/сканирано ) на email: office@progressbg.net или на Viber. След това ще получите допълнителна информация от екипа.

Преподаватели

Ива Емилова Попова

Магистър-инженер по Компютърни системи и технологии, ТУ-София. Повече от 7 години опит като професионален Уеб програмист в утвърдени IT компании, някои от които са Store.bg, Comptel, Internet Securities и Datamax. Има опит като старши Уеб разработчик и ръководител на софтуерен екип. През последните 2 години работи като консултант и програмист на свободна практика в сферата на Семантичния Уеб, което и позволя всеобхватно да прилага, използва и обогатява уменията си в най-модерните аспекти на Уеб Технологиите. Преподавателската дейност на Ива започва през 2004г., когато започва и обучението си като докторант по „Системи с Изкуствен Интелект“ (профил: Семантични търсещи системи) към ТУ-София. Повече от 7 години води дисциплините „Програмиране в Интернет“, „Програмни езици“, „Изкуствен интелект и експертни системи“ като асистент към ТУ-София и други висши учебни заведения. Обича да споделя и обогатява знанията си не само с колеги-програмисти, но и с хора неизкушени доскоро в тази област. Твърдо вярва, че програмирането, в частност – Уеб Технологиите, са за всеки и трябва да бъдат разбираеми за всеки.

Уеб Технологии: HTML5, CSS3, JavaScript (+jQuery, AngularJS, Bootsrtap, Node.js,…)

Бази Данни: MySQL, MongoDB, Berkeley DB

Програмни езици: Perl, Python, C++