Skip to content

fix(1-js-01): Fixed language errors in 1-js 01-getting-started #553

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
dolgachio merged 6 commits into from
Feb 24, 2024
Merged

fix(1-js-01): Fixed language errors in 1-js 01-getting-started #553

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
866a36f
feat(1-01-1-into): Fix language mistakes in 1-intro
ltlaitoff Sep 16, 2023
80f3671
feat(1-01-3-code-editors): Fix language mistakes in 3-code-editors
ltlaitoff Sep 16, 2023
a44632b
feat(1-01-4-devtools): Fix language mistakes in 4-devtools
ltlaitoff Sep 16, 2023
55daebb
fix(1-1-1-intro): Fixed mistake on fix mistakes
ltlaitoff Sep 16, 2023
53f79a6
Update 1-js/01-getting-started/4-devtools/article.md
dolgachio Oct 26, 2023
20a0c2b
Merge branch 'master' into fix-language-errors-in-1-js-01-getting-sta…
dolgachio Feb 24, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 9 additions & 9 deletions 1-js/01-getting-started/1-intro/article.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# Вступ до JavaScript

Давайте розглянемо, що такого особливого в мові JavaScript, чого ми можемо досягти за її допомогою та які ще технології пов’язані з нею.
Розгляньмо, що такого особливого в мові JavaScript, чого ми можемо досягти за її допомогою та які ще технології пов’язані з нею.

## Що таке JavaScript?

Expand Down Expand Up @@ -54,7 +54,7 @@
- Додавати новий HTML-код на сторінку, змінювати наявний вміст, змінювати стилі.
- Реагувати на дії користувача, опрацьовувати натискання миші, переміщення вказівника, натискання на клавіші клавіатури.
- Надсилати запити мережею до віддалених серверів, викачувати та надсилати файли (так звані технології [AJAX](https://uk.wikipedia.org/wiki/AJAX) і [COMET](https://uk.wikipedia.org/wiki/Comet_(програмування))).
- Отримувати і надсилати [куки](https://uk.wikipedia.org/wiki/Куки), ставити запитання відвідувачам, показувати повідомлення.
- Отримувати та надсилати [куки](https://uk.wikipedia.org/wiki/Куки), ставити запитання відвідувачам, показувати повідомлення.
- Запам’ятовувати дані на стороні клієнта ("[local storage](https://developer.mozilla.org/uk/docs/Web/API/Window/localStorage)"), які будуть доступні в майбутніх сесіях на цьому вебсайті.

## Що НЕ може JavaScript?
Expand All @@ -67,17 +67,17 @@

Сучасні браузери дозволяють працювати з файлами, але доступ до них обмежений і надається тільки тоді, коли користувач виконав відповідні дії, наприклад, перетягнув файл у вікно браузера чи вибрав його через теґ `<input>`.

Є шляхи взаємодії з камерою/мікрофоном та іншими пристроями, але для цього потрібен явний дозвіл користувача. Тому сторінка з JavaScript не може нишком увімкнути веб-камеру, спостерігати за оточенням і надсилати інформацію до [СБУ](https://uk.wikipedia.org/wiki/Служба_безпеки_України).
Є шляхи взаємодії з камерою/мікрофоном та іншими пристроями, але для цього потрібен явний дозвіл користувача. Тому сторінка з JavaScript не може нишком увімкнути вебкамеру, спостерігати за оточенням і надсилати інформацію до [СБУ](https://uk.wikipedia.org/wiki/Служба_безпеки_України).
- Різні вкладки/вікна зазвичай не знають одне про одного. Іноді це можливо, наприклад, коли одне вікно використовує JavaScript, щоб відкрити інше. Але навіть у такому випадку JavaScript з однієї сторінки не має доступу до іншої, якщо вони з різних сайтів (мають різні домени, протоколи чи порти).

Це називається "[Політикою того ж походження (Same Origin Policy)](https://uk.wikipedia.org/wiki/Політика_того_ж_походження)". Щоб обійти це обмеження, *обидві сторінки* мають погодитися на обмін даними та містити спеціальний JavaScript-код, який здійснюватиме це. Ми розглянемо цю тему в посібнику.

Знову-таки, це обмеження існує задля безпеки користувача. Сторінка за адресою `http://anysite.com`, яку відкрив користувач, не повинна мати доступу до іншої вкладки браузера з URL-адресою `http://gmail.com` і викрадати звідти інформацію.
- JavaScript може легко спілкуватися мережею з сервером, від якого отримана поточна сторінка. Але здатність скрипта отримувати дані з інших сайтів/доменів обмежена. Такі запити можливі, але потребують спеціальної згоди (вираженої в HTTP-заголовках) від віддаленого сервера. Це також зроблено з метою безпеки.
Знову-таки, це обмеження існує задля безпеки користувача. Сторінка за адресою `http://anysite.com`, яку відкрив користувач, не повинна мати доступ до іншої вкладки браузера з URL-адресою `http://gmail.com` і викрадати звідти інформацію.
- JavaScript може легко спілкуватися мережею з сервером, від якого отримана поточна сторінка. Але здатність скрипту отримувати дані з інших сайтів/доменів обмежена. Такі запити можливі, але потребують спеціальної згоди (вираженої в HTTP-заголовках) від віддаленого сервера. Це також зроблено задля безпеки.

![](limitations.svg)

Таких обмежень немає, якщо JavaScript використовується за межами браузера, наприклад, на сервері. Сучасні браузери дозволяють установлювати плаґіни/розширення, які мають розширені можливості, проте вимагають розширених прав.
Таких обмежень немає, якщо JavaScript використовується за межами браузера, наприклад, на сервері. Сучасні браузери дозволяють установлювати плагіни/розширення, які мають розширені можливості, проте вимагають розширених прав.

## Що робить мову JavaScript унікальною?

Expand Down Expand Up @@ -106,10 +106,10 @@ JavaScript -- це єдина браузерна технологія, яка с

Приклади таких мов:

- [CoffeeScript](http://coffeescript.org/) -- це "синтаксичний цукор" для JavaScript. Вона вводить коротший синтаксис, дозволяючи нам писати більш чіткий і точний код. Зазвичай це до вподоби програмістам, які пишуть на Ruby.
- [CoffeeScript](http://coffeescript.org/) -- це "синтаксичний цукор" для JavaScript. Вона вводить коротший синтаксис, дозволяючи нам писати прозорий та точний код. Зазвичай це до вподоби програмістам, які пишуть на Ruby.
- [TypeScript](http://www.typescriptlang.org/) зосереджена на додаванні "строгої типізації даних" для спрощення розробки та підтримки складних систем. Розробляється Microsoft.
- [Flow](http://flow.org/) також додає типізацію даних, але іншим способом. Розробляється Facebook.
- [Dart](https://dart.dev/) -- це автономна мова, яка має власний рушій, що працює в небраузерних середовищах (як-от мобільні застосунки), але також може транспілюватися в JavaScript. Розробляється Google.
- [Dart](https://dart.dev/) -- це автономна мова, яка має власний рушій, що працює в не браузерних середовищах (як-от мобільні застосунки), але також може транспілюватися в JavaScript. Розробляється Google.
- [Brython](https://brython.info/) -- це транспілятор коду Python у JavaScript, що дозволяє писати застосунки на чистому Python без використання JavaScript.
- [Kotlin](https://kotlinlang.org/docs/js-overview.html) -- це сучасна, лаконічна та безпечна мова програмування, яку можна компілювати для браузера або NodeJS.

Expand All @@ -118,5 +118,5 @@ JavaScript -- це єдина браузерна технологія, яка с
## Підсумки

- Мова JavaScript спочатку була створена лише як мова для браузера, але зараз її також використовують в інших середовищах.
- Сьогодні JavaScript позиціонується як найбільш поширена мова для браузера, яка повністю інтегрована з HTML/CSS.
- Сьогодні JavaScript вважається найбільш поширеною мовою для браузера, яка повністю інтегрована з HTML/CSS.
- Існує багато мов, які "транспілюються" в JavaScript і надають певні функції. Рекомендується переглянути їх, хоча б мигцем, після освоєння JavaScript.
12 changes: 6 additions & 6 deletions 1-js/01-getting-started/3-code-editors/article.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,14 +8,14 @@

Термін [IDE](https://uk.wikipedia.org/wiki/Інтегроване_середовище_розробки) (Інтегроване середовище розробки) означає потужний редактор з багатьма можливостями, що зазвичай працює з "цілим проєктом". Як зрозуміло з назви, це не тільки редактор коду, а повноцінне "середовище розробки".

IDE завантажує проєкт (який може мати багато файлів), дозволяє переключатися між файлами, надає можливість автозаповнення, яке базується на цілому проєкті (не лише на відкритому файлі), інтегрується із системою контролю версій (наприклад, [git](https://git-scm.com/)), надає можливість розгортання вашого проєкту на тестове середовище та багато інших функцій "на рівні проєкту".
IDE завантажує проєкт (який може мати багато файлів), дозволяє перемикатися між файлами, надає можливість автозаповнення, яке базується на цілому проєкті (не лише на відкритому файлі), інтегрується із системою контролю версій (наприклад, [git](https://git-scm.com/)), надає можливість розгортання вашого проєкту на тестове середовище та багато інших функцій "на рівні проєкту".

Якщо Ви досі не вибрали IDE, розгляньте наступні варіанти:

- [Visual Studio Code](https://code.visualstudio.com/) (багатоплатформний, безкоштовний).
- [Visual Studio Code](https://code.visualstudio.com/) (багатоплатформний, безплатний).
- [WebStorm](http://www.jetbrains.com/webstorm/) (багатоплатформний, платний).

Для Windows, також може бути "Visual Studio", не плутайте з "Visual Studio Code". "Visual Studio" -- потужний платний редактор, який працює лише на Windows, добре підходить для програмування на платформі .NET. Також хороший для програмування на JavaScript. Також існує його безкоштовна версія: [Visual Studio Community](https://www.visualstudio.com/vs/community/).
Для Windows, також може бути "Visual Studio", не плутайте з "Visual Studio Code". "Visual Studio" -- потужний платний редактор, який працює лише на Windows, добре підходить для програмування на платформі .NET. Також хороший для програмування на JavaScript. Також існує його безплатна версія: [Visual Studio Community](https://www.visualstudio.com/vs/community/).

Багато IDE платні, проте мають пробний період. Їхня вартість зазвичай незначна в порівнянні із зарплатою кваліфікованого розробника. Правильний вибір редактора дозволить зберегти найцінніший ресурс -- ваш час. Тому просто виберіть найкращий варіант, який задовольнятиме усім вашим потребам.

Expand All @@ -27,12 +27,12 @@ IDE завантажує проєкт (який може мати багато

Головна їхня відмінність від IDE в тому, що IDE працює на рівні проєкту, тому він завантажує набагато більше даних під час запуску, і якщо потрібно, аналізує його структуру. Легкий редактор набагато швидший, якщо нам необхідно відредагували лише один файл.

На практиці, легкі редактори можуть мати багато плаґінів, включаючи аналізатори синтаксису на рівні проєкту, автозаповнення і т. д. Через те, що це значно розширює їх можливості, немає чіткої межі між легкими редакторами та IDE.
На практиці, легкі редактори можуть мати багато плагінів, включаючи аналізатори синтаксису на рівні проєкту, автозаповнення і т. д. Через те, що це значно розширює їх можливості, немає чіткої межі між легкими редакторами та IDE.

Ось ці варіанти заслуговують вашої уваги:

- [Sublime Text](http://www.sublimetext.com) (багатоплатформний, безкоштовний на час випробувального терміну).
- [Notepad++](https://notepad-plus-plus.org/) (Windows, безкоштовний).
- [Sublime Text](http://www.sublimetext.com) (багатоплатформний, безплатний на час випробувального терміну).
- [Notepad++](https://notepad-plus-plus.org/) (Windows, безплатний).
- [Vim](http://www.vim.org/) та [Emacs](https://www.gnu.org/software/emacs/) також хороші, якщо знати, як ними користуватися.

## Не будемо сперечатися
Expand Down
Loading