Як навчитися програмувати 🤓
📌 Розглянемо трохи HTML.
Ви можете думати про HTML (скорочення від HyperText Markup Language), як про основу веб-сторінки. Вона визначає структуру сторінки, вказуючи елементи, які мають відображатися, і порядок їх відображення.
😌 Кожна веб-сторінка, яку ви коли-небудь відвідували у своєму браузері, має певний HTML-код, пов’язаний з нею. Коли ви відвідуєте веб-сторінку, веб-сервер, на якому розміщена веб-сторінка, надсилає HTML у ваш браузер. Потім ваш браузер читає його та відображає для вас.
#codica_tech
📌 Розглянемо трохи HTML.
Ви можете думати про HTML (скорочення від HyperText Markup Language), як про основу веб-сторінки. Вона визначає структуру сторінки, вказуючи елементи, які мають відображатися, і порядок їх відображення.
😌 Кожна веб-сторінка, яку ви коли-небудь відвідували у своєму браузері, має певний HTML-код, пов’язаний з нею. Коли ви відвідуєте веб-сторінку, веб-сервер, на якому розміщена веб-сторінка, надсилає HTML у ваш браузер. Потім ваш браузер читає його та відображає для вас.
#codica_tech
👍9🔥3
💻 Більшість веб-сторінок має досить стандартний вміст: заголовок, текст, посилання на зображення, навігаційні посилання, верхні та нижні колонтитули тощо. Уся ця інформація зберігається у вигляді HTML, який визначає структуру сторінки.
☝️ Слід пам’ятати, що HTML технічно не є мовою програмування, хоча його часто називають «кодом HTML».
🖼 Інші мови програмування дозволяють нам писати код, який щось робить, наприклад, послідовне виконання набору інструкцій. HTML нічого не робить. Ми не запускаємо та не виконуємо HTML. HTML просто зберігається у файлі й чекає, поки його буде надіслано веб-переглядачу, який відобразить його кінцевому користувачеві.
📄 Насправді HTML - це просто дані. Це дані, які визначають, як має виглядати веб-сторінка.
Отже, як писати HTML? 🤔
HTML використовує стандартний набір тегів (переважно просто мітки) для визначення доступних елементів, які складають веб-сторінку. Кожен тег визначається за допомогою кутових дужок.
📌 Наприклад, тег title визначається як <title>Заголовок моєї сторінки</title>, а тег абзацу — як <p>Купа довільного текстового вмісту.</p>.
▪️Кожен елемент HTML складається з початкового та кінцевого тегів. Початковий тег — це лише мітка тегу між кутовими дужками, наприклад: <tagname>
Він відкриває новий тег HTML.
▪️Кінцевий тег, по суті, такий самий, але він використовує косу риску після першої кутової дужки, щоб позначити його як кінцевий тег: </tagname>
📎 Будь-який текст між двома тегами є фактичним вмістом, який відображатиметься на сторінці.
HTML має багато тегів, що надає багатий набір вмісту веб-користувачам. Ми не будемо розглядати їх тут детально, але нижче наведено короткий список для довідки👇
<p>: Абзац тексту, який починається з нового рядка.
<h1>: Заголовок сторінки.
<h2>: Заголовок розділу.
<hx>: Де x — це число від 3 до 6, для менших заголовків.
<img>: Зображення.
<a>: Посилання.
<form>: Форма, що містить поля або дані, які користувач може заповнити та надіслати.
<input>: Поле для введення інформації користувачами, зазвичай у формі.
<div>: Поділ вмісту, який використовується для групування кількох елементів з метою розміщення інтервалів.
<span>: Ще один елемент групування, але використовується для обтікання текстових фраз іншим елементом, зазвичай для застосування певного форматування лише до певної частини текстового вмісту.
#codica_tech
☝️ Слід пам’ятати, що HTML технічно не є мовою програмування, хоча його часто називають «кодом HTML».
🖼 Інші мови програмування дозволяють нам писати код, який щось робить, наприклад, послідовне виконання набору інструкцій. HTML нічого не робить. Ми не запускаємо та не виконуємо HTML. HTML просто зберігається у файлі й чекає, поки його буде надіслано веб-переглядачу, який відобразить його кінцевому користувачеві.
📄 Насправді HTML - це просто дані. Це дані, які визначають, як має виглядати веб-сторінка.
Отже, як писати HTML? 🤔
HTML використовує стандартний набір тегів (переважно просто мітки) для визначення доступних елементів, які складають веб-сторінку. Кожен тег визначається за допомогою кутових дужок.
📌 Наприклад, тег title визначається як <title>Заголовок моєї сторінки</title>, а тег абзацу — як <p>Купа довільного текстового вмісту.</p>.
▪️Кожен елемент HTML складається з початкового та кінцевого тегів. Початковий тег — це лише мітка тегу між кутовими дужками, наприклад: <tagname>
Він відкриває новий тег HTML.
▪️Кінцевий тег, по суті, такий самий, але він використовує косу риску після першої кутової дужки, щоб позначити його як кінцевий тег: </tagname>
📎 Будь-який текст між двома тегами є фактичним вмістом, який відображатиметься на сторінці.
HTML має багато тегів, що надає багатий набір вмісту веб-користувачам. Ми не будемо розглядати їх тут детально, але нижче наведено короткий список для довідки👇
<p>: Абзац тексту, який починається з нового рядка.
<h1>: Заголовок сторінки.
<h2>: Заголовок розділу.
<hx>: Де x — це число від 3 до 6, для менших заголовків.
<img>: Зображення.
<a>: Посилання.
<form>: Форма, що містить поля або дані, які користувач може заповнити та надіслати.
<input>: Поле для введення інформації користувачами, зазвичай у формі.
<div>: Поділ вмісту, який використовується для групування кількох елементів з метою розміщення інтервалів.
<span>: Ще один елемент групування, але використовується для обтікання текстових фраз іншим елементом, зазвичай для застосування певного форматування лише до певної частини текстового вмісту.
#codica_tech
👍18🔥11
6 веб-сайтів, які допоможуть вам виділитися серед інших 🤠
💎 ScribeHow
Миттєво перетворюйте будь-який процес на покроковий посібник.
• Натисніть запис.
• Робіть те, що хочете комусь показати.
• Отримайте гарний автоматично створений посібник.
💎 Quillbot
Інструмент перефразування, який переписує та вдосконалює будь-яке речення, абзац або статтю за допомогою AI.
💎 Oh shit, Git!
Погані ситуації та часті помилки, які ми робимо під час роботи з Git.
💎 ParityDeals
Оптимізуйте ціни на продукти в різних країнах, щоб збільшити дохід.
💎 Marker
Повідомляйте про візуальні помилки безпосередньо у своїх улюблених інструментах, не залишаючи веб-сайт або веб-програму.
💎 Can I use
«Can I use» надає оновлені таблиці підтримки веб-переглядачів для підтримки зовнішніх веб-технологій у веб-браузерах для ПК і мобільних.
Ютуб Codica People | Інстаграм Codica
#codica_advice
💎 ScribeHow
Миттєво перетворюйте будь-який процес на покроковий посібник.
• Натисніть запис.
• Робіть те, що хочете комусь показати.
• Отримайте гарний автоматично створений посібник.
💎 Quillbot
Інструмент перефразування, який переписує та вдосконалює будь-яке речення, абзац або статтю за допомогою AI.
💎 Oh shit, Git!
Погані ситуації та часті помилки, які ми робимо під час роботи з Git.
💎 ParityDeals
Оптимізуйте ціни на продукти в різних країнах, щоб збільшити дохід.
💎 Marker
Повідомляйте про візуальні помилки безпосередньо у своїх улюблених інструментах, не залишаючи веб-сайт або веб-програму.
💎 Can I use
«Can I use» надає оновлені таблиці підтримки веб-переглядачів для підтримки зовнішніх веб-технологій у веб-браузерах для ПК і мобільних.
Ютуб Codica People | Інстаграм Codica
#codica_advice
👍18❤1🔥1😁1
Що буде виведено у консоль?
Anonymous Quiz
18%
true false
24%
false false
20%
true true
18%
undefined
19%
Не знаю
👍6🔥5
📌 На картинці зверху HTML 5
Не використовуйте елемент «Div» постійно ☝️
✅ Використовуйте семантичні елементи, які можуть допомогти вам підвищити доступність, покращити SEO та покращити читабельність коду як для людей, так і для машин.
YouTube Codica People | Instagram Codica
#codica_advice
Не використовуйте елемент «Div» постійно ☝️
✅ Використовуйте семантичні елементи, які можуть допомогти вам підвищити доступність, покращити SEO та покращити читабельність коду як для людей, так і для машин.
YouTube Codica People | Instagram Codica
#codica_advice
👍35🔥4👎1
Як обговорювати зарплату на співбесіді❓
#НапуттяВід_HR Директорки Клименко Наталії
Друзі, сьогодні ми поговоримо про дуже чутливу тему, про яку можна міркувати годинами: як грамотно озвучити свої фінансові очікування на співбесіді.
☝️ Насамперед важливо зрозуміти, що на співбесіді претендент і роботодавець перебувають у рівних умовах: першому потрібна робота, а другому - співробітник. Тому процес переговорів однаково важливий для обох. Претендент боїться відмови, а компанія, у свою чергу, переживає, що відповідний кандидат не знайдеться або не погодиться на її умови.
#НапуттяВід_HR Директорки Клименко Наталії
Друзі, сьогодні ми поговоримо про дуже чутливу тему, про яку можна міркувати годинами: як грамотно озвучити свої фінансові очікування на співбесіді.
☝️ Насамперед важливо зрозуміти, що на співбесіді претендент і роботодавець перебувають у рівних умовах: першому потрібна робота, а другому - співробітник. Тому процес переговорів однаково важливий для обох. Претендент боїться відмови, а компанія, у свою чергу, переживає, що відповідний кандидат не знайдеться або не погодиться на її умови.
👍10🔥2
Отже, перше, що вам потрібно зробити, це ще вдома до інтерв'ю сформулювати для себе три цифри:
📌 згадати свій поточний дохід, якщо він у вас був. Продумати, за який функціонал ви одержували цю суму. Це вам допоможе звучати впевненіше на інтерв'ю;
📌 сформулювати бажаний дохід, тобто скільки в ідеалі вам хотілося б отримувати на новому місці роботи;
📌 продумати мінімальну планку очікувань, нижче за яку вам буде вже не цікаво працювати на даній посаді. Це вам допоможе відповісти на запитання рекрутера, якщо спитають, чи ви готові на менші очікування.
👉 Далі, важливий момент: порівнюйте бажану зарплату з обсягом і специфікою роботи та вашим інтересом. Називаючи бажану цифру, подумайте про те, чим ви можете її обґрунтувати. Намагайтеся домовитися про оплату, яка принаймні виправдовує ваші трудовитрати.
💁🏻♀️ При розмові про гроші я раджу завжди тримати доброзичливий, але діловий настрій. Що ми під цим розуміємо?
💰 про гроші краще не жартувати, якщо не володієте цим мистецтвом досконало, не всі зможуть це оцінити;
💰 не потрібно йти у розмиті формулювання, наприклад: “За різну роботу просять різні гроші”;
💰 не потрібно йти в маніпуляції на кшталт: “Хочу максимум, який може дозволити собі ваша компанія”;
💰 не брешіть, повірте, ті, хто проводить з вами співбесіду, добре знають ринок та очікування кандидатів.
З іншого боку, якщо представник компанії не налаштований спілкуватися конструктивно з приводу грошей і теж іде в маніпуляції, то подумайте, наскільки вам ця компанія може бути цікавою 🤔
На які аргументи можна спиратися під час обговорення ваших очікувань:
✔️ реалії ринку. Оперуйте інформацією про зарплати у вашій сфері. Говоріть про те, що вивчили ринок та знаєте реальну вартість ваших навичок;
✔️ вашу цінність як працівника. Для компанії вона вимірюється не лише в грошах, а й у тому, яку користь ви зможете принести. Наприклад, скільки нових клієнтів ви приведете, скільки вакансій зможете закрити, скільки статей напишете, чи зможете оптимізувати та налаштувати робочі процеси тощо;
✔️ унікальне поєднання необхідних роботодавцю навичок. Наприклад, ви можете робити не тільки бекенд частину, але ще й знаєте фронтенд, до того ж маєте розмовну англійську.
Які запитання від вас зможуть показати, що ви налаштовані серйозно:
▪️ “Я зможу точно визначити свої очікування, коли конкретніше зрозумію своє навантаження та зміст роботи”;
▪️ “Я розраховую на справедливу середню компенсацію ринку”;
▪️ можна ставити зустрічне запитання: “Чи є у вас певний бюджет на цю роль?” - і таке інше.
💎 Домагаючись кращої для себе пропозиції, не зациклюйтеся на окладі, є безліч інших варіантів компенсації. Наприклад, якщо ви розробник-початківець, то подумайте про практику, яку зможете отримати, досвідченого наставника, який буде вам допомагати рости. Якщо ви вже бувалий, то предметом переговорів можуть бути одноразові премії, бонуси, опціони, страхування, допомога з релокейтом та інші вигоди.
❗️Загалом у процесі інтерв'ю ви повинні довести роботодавцю, що ваші навички та досвід будуть корисні компанії. Важливо не просто просити більше грошей, а протягом усієї розмови вибудовувати довірчі стосунки.
Бажаю всім грамотно обговорювати свою зарплату та отримати очікуване! ❤️
#НапуттяВід_HR
📌 згадати свій поточний дохід, якщо він у вас був. Продумати, за який функціонал ви одержували цю суму. Це вам допоможе звучати впевненіше на інтерв'ю;
📌 сформулювати бажаний дохід, тобто скільки в ідеалі вам хотілося б отримувати на новому місці роботи;
📌 продумати мінімальну планку очікувань, нижче за яку вам буде вже не цікаво працювати на даній посаді. Це вам допоможе відповісти на запитання рекрутера, якщо спитають, чи ви готові на менші очікування.
👉 Далі, важливий момент: порівнюйте бажану зарплату з обсягом і специфікою роботи та вашим інтересом. Називаючи бажану цифру, подумайте про те, чим ви можете її обґрунтувати. Намагайтеся домовитися про оплату, яка принаймні виправдовує ваші трудовитрати.
💁🏻♀️ При розмові про гроші я раджу завжди тримати доброзичливий, але діловий настрій. Що ми під цим розуміємо?
💰 про гроші краще не жартувати, якщо не володієте цим мистецтвом досконало, не всі зможуть це оцінити;
💰 не потрібно йти у розмиті формулювання, наприклад: “За різну роботу просять різні гроші”;
💰 не потрібно йти в маніпуляції на кшталт: “Хочу максимум, який може дозволити собі ваша компанія”;
💰 не брешіть, повірте, ті, хто проводить з вами співбесіду, добре знають ринок та очікування кандидатів.
З іншого боку, якщо представник компанії не налаштований спілкуватися конструктивно з приводу грошей і теж іде в маніпуляції, то подумайте, наскільки вам ця компанія може бути цікавою 🤔
На які аргументи можна спиратися під час обговорення ваших очікувань:
✔️ реалії ринку. Оперуйте інформацією про зарплати у вашій сфері. Говоріть про те, що вивчили ринок та знаєте реальну вартість ваших навичок;
✔️ вашу цінність як працівника. Для компанії вона вимірюється не лише в грошах, а й у тому, яку користь ви зможете принести. Наприклад, скільки нових клієнтів ви приведете, скільки вакансій зможете закрити, скільки статей напишете, чи зможете оптимізувати та налаштувати робочі процеси тощо;
✔️ унікальне поєднання необхідних роботодавцю навичок. Наприклад, ви можете робити не тільки бекенд частину, але ще й знаєте фронтенд, до того ж маєте розмовну англійську.
Які запитання від вас зможуть показати, що ви налаштовані серйозно:
▪️ “Я зможу точно визначити свої очікування, коли конкретніше зрозумію своє навантаження та зміст роботи”;
▪️ “Я розраховую на справедливу середню компенсацію ринку”;
▪️ можна ставити зустрічне запитання: “Чи є у вас певний бюджет на цю роль?” - і таке інше.
💎 Домагаючись кращої для себе пропозиції, не зациклюйтеся на окладі, є безліч інших варіантів компенсації. Наприклад, якщо ви розробник-початківець, то подумайте про практику, яку зможете отримати, досвідченого наставника, який буде вам допомагати рости. Якщо ви вже бувалий, то предметом переговорів можуть бути одноразові премії, бонуси, опціони, страхування, допомога з релокейтом та інші вигоди.
❗️Загалом у процесі інтерв'ю ви повинні довести роботодавцю, що ваші навички та досвід будуть корисні компанії. Важливо не просто просити більше грошей, а протягом усієї розмови вибудовувати довірчі стосунки.
Бажаю всім грамотно обговорювати свою зарплату та отримати очікуване! ❤️
#НапуттяВід_HR
👍25❤7👎1
5 основних причин, чому варто використовувати React для веб-розробки 🙃
✔️ Перевірений часом, простий для розуміння робочий процес розробника.
✔️ Максимальна гнучкість і сумісність.
✔️ Висока продуктивність, посилена Virtual DOM.
✔️ Величезна спільнота та ресурси, що визначають ринок.
✔️ Синтаксис JSX для розширеного HTML.
Не соромтеся залишати свої думки в коментарях нижче 🙂
Надсилайте будь-які запитання, пов’язані з веб-розробкою.
YouTube Codica People | Instagram Codica
#codica_advice
✔️ Перевірений часом, простий для розуміння робочий процес розробника.
✔️ Максимальна гнучкість і сумісність.
✔️ Висока продуктивність, посилена Virtual DOM.
✔️ Величезна спільнота та ресурси, що визначають ринок.
✔️ Синтаксис JSX для розширеного HTML.
Не соромтеся залишати свої думки в коментарях нижче 🙂
Надсилайте будь-які запитання, пов’язані з веб-розробкою.
YouTube Codica People | Instagram Codica
#codica_advice
👍10🔥3
🇺🇸 I left my last job because I had no ...... to travel.
🇺🇦 Я звільнився зі своєї останньої роботи, бо не мав можливості подорожувати.
🇺🇦 Я звільнився зі своєї останньої роботи, бо не мав можливості подорожувати.
Anonymous Quiz
9%
place
5%
position
84%
opportunity
1%
Не знаю
❤17👍6
Тримайте невеличкий дайджест новин від @Mister_Cody 📰
👤 Портрет ІТ-спеціаліста — 2022. Аналітика
В опитуванні взяла участь рекордна кількість учасників — 15 135. Те, що 95% з них працюють фултайм, свідчить, що наша галузь непогано почувається в умовах воєнного часу.
🕹 В останньому оновленні Xbox з’явилася підтримка української мови
📲 «Все, що ви скажете, може бути використано проти вас»
В українському IT вже не раз траплялися випадки, коли спеціалісти та спеціалістки залишалися без роботи через свої дописи в соціальних мережах. Далеко не всі кейси ставали публічними, а рекрутери кажуть: йдеться не лише про висловлювання проросійської позиції.
🇺🇦 Україна отримає від НАТО системи боротьби з іранськими «мопедами»
💁♂️ SET University навчатиме кібербезпеки за донати від 100 грн, щоб допомогти вчителям із Бородянки
📅 Перший воркшоп заплановано на 26 жовтня. Він буде присвячений темі SQL та XSS ін’єкцій.
📆 Другий - стосуватиметься теми ризиків інформаційної безпеки компанії й пройде 1 листопада.
👤 Портрет ІТ-спеціаліста — 2022. Аналітика
В опитуванні взяла участь рекордна кількість учасників — 15 135. Те, що 95% з них працюють фултайм, свідчить, що наша галузь непогано почувається в умовах воєнного часу.
🕹 В останньому оновленні Xbox з’явилася підтримка української мови
📲 «Все, що ви скажете, може бути використано проти вас»
В українському IT вже не раз траплялися випадки, коли спеціалісти та спеціалістки залишалися без роботи через свої дописи в соціальних мережах. Далеко не всі кейси ставали публічними, а рекрутери кажуть: йдеться не лише про висловлювання проросійської позиції.
🇺🇦 Україна отримає від НАТО системи боротьби з іранськими «мопедами»
💁♂️ SET University навчатиме кібербезпеки за донати від 100 грн, щоб допомогти вчителям із Бородянки
📅 Перший воркшоп заплановано на 26 жовтня. Він буде присвячений темі SQL та XSS ін’єкцій.
📆 Другий - стосуватиметься теми ризиків інформаційної безпеки компанії й пройде 1 листопада.
👍12🔥3
Codica - корисне про IT
Як навчитися програмувати 🤓 📌 Розглянемо трохи HTML. Ви можете думати про HTML (скорочення від HyperText Markup Language), як про основу веб-сторінки. Вона визначає структуру сторінки, вказуючи елементи, які мають відображатися, і порядок їх відображення.…
Як навчитися програмувати 💻
Частина 7
📌 Розглянемо трохи CSS.
CSS Cascading Style Sheets (каскадні листи стилів) – це набір правил оформлення і форматування, який може бути застосований до різних елементів сторінки.
💁♂️ Застосовуючи CSS, ви можете один раз описати властивості елементів і визначити цей опис як стиль, а надалі просто вказувати, що елемент, який ви бажаєте оформити відповідним чином, повинен прийняти властивості стилю, описаного вами.
#codica_tech
Частина 7
📌 Розглянемо трохи CSS.
CSS Cascading Style Sheets (каскадні листи стилів) – це набір правил оформлення і форматування, який може бути застосований до різних елементів сторінки.
💁♂️ Застосовуючи CSS, ви можете один раз описати властивості елементів і визначити цей опис як стиль, а надалі просто вказувати, що елемент, який ви бажаєте оформити відповідним чином, повинен прийняти властивості стилю, описаного вами.
#codica_tech
👍9❤3
🖥 HTML-документ являє собою безліч вкладених один в одного елементів (наприклад, елементи BODY, DIV, P, H1, IMG та ін.).
Для кожного тегу HTML-документа передбачено певний набір властивостей, що записуються у вигляді атрибутів та їх значень, які вказують у відкриваючому тегу.
👉 Серед усіх припустимих властивостей тегу є такі, які безпосередньо пов’язані зі стилями, які можливо задати за допомогою CSS (наприклад, гарнітура або колір шрифту конкретного абзацу, колір фону документа, розміри малюнка). Такі властивості називаються стильовими властивостями (або властивостями стилю).
📎 Властивість стилю – це параметр стильового оформлення документа, що визначається специфікацією CSS.
💁♂️ Якщо провести аналогію з синтаксисом HTML, то властивості, які застосовуються в листах стилів, нагадують атрибути тегів та їхні значення.
▪️Синтаксис:
найменування властивості : значення
Додавши до тегу атрибут style із вказівкою необхідних властивостей, досить легко змінити стиль елемента.
▪️Синтаксис:
<тег style=” найменування властивості: значення”>
✏️ Основна концепція CSS -
форматування документа повинно бути відділеним від його змісту.
🖇 Для розміщення інформації про стиль застосовується спеціальний контейнер <STYLE></STYLE>, який має вигляд:
<STYLE TYPE="text/css">
<!- Опис листа стилів->
</STYLE>
🔖 Значення text/css атрибута type повідомляє браузеру, що у поточному файлі застосований текст мовою CSS.
🪄 У каскадних таблицях стилів (CSS) для установки кольору елементу розмітки і його вмісту призначена CSS-властивість color (під вмістом елементу розмітки зазвичай розуміється текст, що міститься в нім), а для установки кольору фону елементу розмітки - CSS-властивість background-color.
CSS- правила:
🔳 запис коментарів;
🔳 стильові властивості вводяться за допомогою визначення стилю, що позначають фігурними дужками: {font-size:10pt};
🔳 у визначенні стилю можуть записуватися через крапку з комою кілька властивостей: {font-size:10pt; font-family: arial; color:green та ін.};
🔳 призначення стилю тому або іншому елементу html складається у встановленні зв’язку – елемент {визначення стилю}.
❗️Елемент, до якого належить обумовлений стиль, узагальнено називається селектором.
▪️Синтаксис:
селектор {властивість1: значення; властивість 2: значення }
🔎 Селектори діляться на декілька типів: селектори тегів, ідентифікатори і класи.
🗂 Запис, що складається із селектора та визначення стилю, називається CSS-правилом. Листи стилів – це, фактично, набори CSS- правил, які задають властивості форматування елементів документа.
#codica_tech
Для кожного тегу HTML-документа передбачено певний набір властивостей, що записуються у вигляді атрибутів та їх значень, які вказують у відкриваючому тегу.
👉 Серед усіх припустимих властивостей тегу є такі, які безпосередньо пов’язані зі стилями, які можливо задати за допомогою CSS (наприклад, гарнітура або колір шрифту конкретного абзацу, колір фону документа, розміри малюнка). Такі властивості називаються стильовими властивостями (або властивостями стилю).
📎 Властивість стилю – це параметр стильового оформлення документа, що визначається специфікацією CSS.
💁♂️ Якщо провести аналогію з синтаксисом HTML, то властивості, які застосовуються в листах стилів, нагадують атрибути тегів та їхні значення.
▪️Синтаксис:
найменування властивості : значення
Додавши до тегу атрибут style із вказівкою необхідних властивостей, досить легко змінити стиль елемента.
▪️Синтаксис:
<тег style=” найменування властивості: значення”>
✏️ Основна концепція CSS -
форматування документа повинно бути відділеним від його змісту.
🖇 Для розміщення інформації про стиль застосовується спеціальний контейнер <STYLE></STYLE>, який має вигляд:
<STYLE TYPE="text/css">
<!- Опис листа стилів->
</STYLE>
🔖 Значення text/css атрибута type повідомляє браузеру, що у поточному файлі застосований текст мовою CSS.
🪄 У каскадних таблицях стилів (CSS) для установки кольору елементу розмітки і його вмісту призначена CSS-властивість color (під вмістом елементу розмітки зазвичай розуміється текст, що міститься в нім), а для установки кольору фону елементу розмітки - CSS-властивість background-color.
CSS- правила:
🔳 запис коментарів;
🔳 стильові властивості вводяться за допомогою визначення стилю, що позначають фігурними дужками: {font-size:10pt};
🔳 у визначенні стилю можуть записуватися через крапку з комою кілька властивостей: {font-size:10pt; font-family: arial; color:green та ін.};
🔳 призначення стилю тому або іншому елементу html складається у встановленні зв’язку – елемент {визначення стилю}.
❗️Елемент, до якого належить обумовлений стиль, узагальнено називається селектором.
▪️Синтаксис:
селектор {властивість1: значення; властивість 2: значення }
🔎 Селектори діляться на декілька типів: селектори тегів, ідентифікатори і класи.
🗂 Запис, що складається із селектора та визначення стилю, називається CSS-правилом. Листи стилів – це, фактично, набори CSS- правил, які задають властивості форматування елементів документа.
#codica_tech
👍13❤2🔥1
Що виведе код на зображенні?
Anonymous Quiz
21%
true
15%
помилку
15%
"Невеликий их"
30%
false
19%
Не знаю
👍6🔥1
5 інструментів для розробників, про які ви не чули 🙃
❓Біль: відсутність комунікаційних інструментів для розробників.
💡Рішення: GitLive потрібен для спільної роботи на GitHub у реальному часі. Дозволяє бачити в реальному часі активність інших користувачів.
👉 Після встановлення додає режим командного перегляду. Показує всі незавершені роботи кожного співробітника Git-репозиторію.
📌 Однією з головних функцій є автоматичне виявлення конфліктів злиття. Різниця між вашими локальними змінами та незавершеною роботою ваших колег відображається для поточного відкритого файлу в жолобі IDE.
#codica_tech
❓Біль: відсутність комунікаційних інструментів для розробників.
💡Рішення: GitLive потрібен для спільної роботи на GitHub у реальному часі. Дозволяє бачити в реальному часі активність інших користувачів.
👉 Після встановлення додає режим командного перегляду. Показує всі незавершені роботи кожного співробітника Git-репозиторію.
📌 Однією з головних функцій є автоматичне виявлення конфліктів злиття. Різниця між вашими локальними змінами та незавершеною роботою ваших колег відображається для поточного відкритого файлу в жолобі IDE.
#codica_tech
👍14❤1
❓Біль: потреба в численних додатках CRUD, що виявляється повторюваним і часто трудомістким завданням.
💡 Рішення: Appsmith — фреймворк із відкритим вихідним кодом для створення внутрішніх інструментів. Автори Appsmith описують його як «UI-інструмент для сильно завантажених розробників». Він годиться для команд, які створюють безліч внутрішніх програм, що розміщуються всередині власної інфраструктури та брандмауера.
👉 За допомогою Appsmith можна легко створювати дашборди, робочі процеси та приладові панелі, перетягуючи готові віджети, що налаштовуються. Інструмент легко інтегрується з REST або GraphQL API та взаємодіє з JavaScript для створення логіки програми.
❓Біль: на код-рев'ю йде багато часу, що збільшує можливість появи помилки через людський фактор.
💡Рішення: DeepSource – платформа для швидкого та безпечного статистичного аналізу.
👀 Інструмент здатний автоматично виявити вразливості та проблеми з документуванням коду. Він може знаходити проблеми в кодовій базі та автоматично відправляти пул-реквест для їх виправлення.
👉 Працює з Docker, Java, JavaScript, Go, Python, Ruby, PHP та SQL. Інтегрується з GitHub, GitLab та BitBucket. Є можливість розгортання на місці. За словами авторів інструменту, його використання дозволяє заощадити 3,8 години в середньому на одного розробника на тиждень.
❓Біль: складні та громіздкі кодові бази та відсутність загального розуміння того, як код та функціональність пов'язані один з одним.
💡Рішенння: інструмент CodeSee Maps візуалізує кодову базу.
👉 Надає автоматично генеровані, самооновлювальні діаграми коду. Вони синхронізують кодову базу в міру розвитку коду, щоб можна було швидко виявляти крос-кодові залежності і переміщатися між файлами і папками. Це може покращити розуміння кодової бази та допомогти при онбордингу, плануванні та рев'ю.
😌 Інструмент створений для розробників, але годиться всім, хто взаємодіє із командою.
🔖 Щоб розпочати використання CodeSee Maps, необхідно авторизувати CodeSee в обліковому записі GitHub, потім встановити та авторизувати CodeSee Architecture Diagrams GitHub у репозиторіях, для яких потрібно створити карти.
❓Біль: налаштування внутрішнього інструментарію та додатків забирає багато часу та відволікає розробників від реальних проблем, які вони намагаються вирішити.
💡Рішення: WayScript — хмарне віртуальне середовище розробки для створення та надання застосунків та внутрішніх інструментів.
👉 Надає попередньо налаштовані контейнери, в які можна вбудувати код, щоб він працював із наявною інфраструктурою команди. За допомогою WayScript можна швидко налаштувати API, сервери, cron-завдання, точки входу користувача, інтерфейси та багато іншого.
✔️ Коли інструмент буде готовий, його можна розгорнути одним кліком миші та надіслати команді. Також його можна використовувати, завантаживши локальну програму або веб-версію.
YouTube Codica People | Instagram Codica
#codica_tech
💡 Рішення: Appsmith — фреймворк із відкритим вихідним кодом для створення внутрішніх інструментів. Автори Appsmith описують його як «UI-інструмент для сильно завантажених розробників». Він годиться для команд, які створюють безліч внутрішніх програм, що розміщуються всередині власної інфраструктури та брандмауера.
👉 За допомогою Appsmith можна легко створювати дашборди, робочі процеси та приладові панелі, перетягуючи готові віджети, що налаштовуються. Інструмент легко інтегрується з REST або GraphQL API та взаємодіє з JavaScript для створення логіки програми.
❓Біль: на код-рев'ю йде багато часу, що збільшує можливість появи помилки через людський фактор.
💡Рішення: DeepSource – платформа для швидкого та безпечного статистичного аналізу.
👀 Інструмент здатний автоматично виявити вразливості та проблеми з документуванням коду. Він може знаходити проблеми в кодовій базі та автоматично відправляти пул-реквест для їх виправлення.
👉 Працює з Docker, Java, JavaScript, Go, Python, Ruby, PHP та SQL. Інтегрується з GitHub, GitLab та BitBucket. Є можливість розгортання на місці. За словами авторів інструменту, його використання дозволяє заощадити 3,8 години в середньому на одного розробника на тиждень.
❓Біль: складні та громіздкі кодові бази та відсутність загального розуміння того, як код та функціональність пов'язані один з одним.
💡Рішенння: інструмент CodeSee Maps візуалізує кодову базу.
👉 Надає автоматично генеровані, самооновлювальні діаграми коду. Вони синхронізують кодову базу в міру розвитку коду, щоб можна було швидко виявляти крос-кодові залежності і переміщатися між файлами і папками. Це може покращити розуміння кодової бази та допомогти при онбордингу, плануванні та рев'ю.
😌 Інструмент створений для розробників, але годиться всім, хто взаємодіє із командою.
🔖 Щоб розпочати використання CodeSee Maps, необхідно авторизувати CodeSee в обліковому записі GitHub, потім встановити та авторизувати CodeSee Architecture Diagrams GitHub у репозиторіях, для яких потрібно створити карти.
❓Біль: налаштування внутрішнього інструментарію та додатків забирає багато часу та відволікає розробників від реальних проблем, які вони намагаються вирішити.
💡Рішення: WayScript — хмарне віртуальне середовище розробки для створення та надання застосунків та внутрішніх інструментів.
👉 Надає попередньо налаштовані контейнери, в які можна вбудувати код, щоб він працював із наявною інфраструктурою команди. За допомогою WayScript можна швидко налаштувати API, сервери, cron-завдання, точки входу користувача, інтерфейси та багато іншого.
✔️ Коли інструмент буде готовий, його можна розгорнути одним кліком миші та надіслати команді. Також його можна використовувати, завантаживши локальну програму або веб-версію.
YouTube Codica People | Instagram Codica
#codica_tech
👍11🔥2❤1👎1