Globals in TypeScript 🌍

Буває ж таке, що у вас є глобальна змінна чи функція, а TypeScript вдає, що ніколи про таку не чув? Найчастіше таке трапляється, коли ви додаєте сторонній скрипт собі у застосунок.

В даному випадку вам допоможе declare global. Таким чином ви можете ОГОЛОСИТИ змінну, тим самим пояснити TypeScript, що така змінна існує, має певний тип та є глобальною. Часто такі змінні/функції додаються саме до обʼєкту window, тож ви можете просто розширити цей інтерфейс (в чому різниця інтерфейсів та типів, і що означає розширити писали тут).

Matt Pocock у своєму відео детальніше демонструє, яким чином можна налаштувати типи для глобальних змінних, як зробити їх доступними тільки у поточному файлі або у всьому проекті.

👉 Дивитись відео

#interview

СЕКС
не пропонуємо, але пропонуємо підписатись на крутий YouTube канал! 😅

Всі ми добре знаємо нашого колєгу @Yurets7777! Він максимально активний у нас в чаті, але разом із тим ще й корисні відео записує.

Тому ловіть круті підбірки його відео на різну тематику:
- Браузерні API
- AI-шне | нейромережі
- Node.JS
- Телеграм Боти

Він дуже старається, тому кому заходить такий формат і подача, you are welcome!

👉 Відкрити посилання на канал

P.S. А якщо ви хочете бути в центрі всіх подій та новин, тоді вам точно до нас в чат!

#todo написати функцію, що приймає натуральне число n, та повертає n-не число з послідовності Фібоначчі. За початкові числа взяти 0 та 1.

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

👉 Відкрити посилання на майданчики

Для швидкого ознайомлення можна використати Learn X in Y minutes.

👉 Відкрити посилання

Чи можливо зробити ChatGPT-7? 🤯
#post_from @neanime

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

👉 Відкрити посилання

Всіх запрошуємо до прочитання! 💛

Welcome!

Let's practice our English! So...

👉 Where do you prefer to live - in a city or a village? 🌍

Have a nice #english_friday 💛

#how_to створити анімацію виділення тексту 💬

Виконаний з допомогою HTML та CSS!

👉 Відкрити посилання

Is HTML a programming language? 🤨

Початок нового тижня і, щоб до кінця прокинутись, попрограмуємо на HTML. Насправді, ми довго тримались, але нарешті вирішили детальніше розглянути htmx. Так, так, саме htmx.

Сам по собі HTML може небагато, тому майже завжди в нас є JavaScript, а в більшості випадків - бібліотеки та фреймворки: jQuery, React, Angular, Vue…

htmx - це теж бібліотека JavaScript, проте вона має дещо інші ідеї. Одна з них - розширення функціоналу HTML. htmx зазвичай працює за допомогою атрибутів. Наприклад, додайте hx-post="/like" до <button />, щоб змусити кнопку відправляти POST запит за посиланням /like. Ще, тут дуже важлива відповідь сервера, адже саме шмат HTML, який сервер повертає буде додано в поточну сторінку. Інші атрибути, такі як hx-target чи hx-swap визначають, що саме і де потрібно замінити.

Знаємо, що в Інтернеті думки щодо htmx дуже сильно поділились. Ми тільки почали його пробувати, тому зараз ще важко дати обґрунтовану оцінку. Але перше враження позитивне - це щось нове для нас, здається, що такий підхід може добре працювати, як мінімум для невеликих проектів.

А ще, коли ми розповідали про shadcn/ui, то згадували рейтинг проектів, що отримали найбільшу кількість зірок за 2023. htmx посів 10 місце у загальному рейтингу і 2 місце серед front-end фреймворків/бібліотек після React.

👉 Відкрити посилання

Там є багато прикладів, які наглядно показують роботу htmx. А нижче ще додаємо короткий огляд від Fireship.

👉 Дивитись відео

#library

Що відбувається у браузері, коли ви завантажуєте веб-сторінку? 🤔

Про DOM ви вже напевно знаєте, а от як браузер будує CSSOM та як це працює разом з DOM? Яким чином це все промальовується у вас на екрані та як можна полегшити роботу браузеру? Про це все ми вам не розкажемо, але розкаже Сергій Бабіч у своїй лекції.

👉 Дивитись відео

#interview

Як прохалявити? 🛀

Буває ж таке, що потрібно годинку повчитись літати на дроні, вибігти за кавою чи просто подивитись супермаму. Але ж треба світитись в Slack, щоб начальник не дав по шапці. Тому потрібно, щоб компʼютер не переходив в режим сну, а ще краще симулював роботу користувача (рухав мишкою чи натискав клавішу).

caffeinate - команда для Mac, яка запобігає входу компʼютера в режим сну. Додайте ще параметри -disu, щоб все гарно працювало в режимі роботи від батареї. Деякі Linux дистрибутиви також мають схожу утиліту, під назвою caffeine.

Проте цієї команди може бути замало, тому можна ще встановити програми, що рухають мишкою. Наприклад, Move Mouse, прямо з Windows Store. А на Linux можна симулювати натискання клавіші (наприклад, Left Shift) за допомогою xdotool (xdotool keydown Shift_L keyup Shift_L).

Це такий мінімум, тому діліться ще своїми методами в коментарях ⬇️

Тільки ми вам нічого не казали 🤫

#tips

Welcome!

Let's practice our English! So...

👉 Do you have a tattoo? How do you feel about it in general?

Have a nice #english_friday 💛

Чи буде валідним цей TypeScript код?

as const 🤨

Для тих, хто клікнув на "👍 Так" у попередньому пості, радимо переглянути коротке відео з поясненням. Воно дає зрозуміти, чому TypeScript такий строгий стосовно типів у такому коді.

👉 Дивитись відео

А для того, щоб краще розібратись з конструкцією as const у TypeScript, дивіться повне відео.

👉 Дивитись відео

#shorts

#todo написати функцію на будь-якій мові програмування, яка приймає масив рядків тексту, кожен з елементів яких - "Like" або "Dislike". Кожен елемент позначає клік по відповідній кнопці (наприклад, YouTube-відео). Функція має повернути остаточний стан кнопок ("Like", "Dislike" або "None").

Наприклад:
["Like"] => "Like"
["Like", "Like"] => "None"
["Like", "Dislike"] => "Dislike"
["Like", "Dislike", "Like"] => "Like"
["Like", "Dislike", "Dislike"] => "None"

Вічно можна дивитись на 3 речі: вогонь, воду і як програміст налаштовує своє робоче середовище.

Діліться в коментарях, які теми в середовищах розробки ви використовуєте. А ще краще - додайте скріншот, можливо хтось перейде на вашу сторону 😈