​Создайте фитнес-трекер с React и Firebase

Давайте сделаем на этих выходных что-то необычное и крутое! Сегодня предлагаем вас руководство по созданию фитнес-трекера, который будет реализован в виде веб-приложения на React.

Если интересно, то переходите по ссылке:

https://tprg.ru/uInp

#react

Основные переходы и анимация в Svelte

Для работы с анимациями и переходами в Svelte не нужно ничего придумывать или подключать сторонние библиотеки. Разработчик продумали этот момент и добавили необходимое сразу во фреймворк.

В этой статье вы научитесь использовать их:

https://tprg.ru/HhAz

#svelte

​Идеальный инструмент для работы с СУБД без SQL для Node.js или Все, что вы хотели знать о Sequelize

Sequelize — это ORM для работы с системами управления базами данных, которая позволяет взаимодействовать с БД, используя синтаксис приложения. То есть веб-разработчик может обращаться к БД, используя привычный JavaScript.

В этой статье вы сможете ближе познакомиться с Sequelize и узнать его особенности:

https://tprg.ru/h3mK

​Изучение свойства CSS Position с примерами

Подробное, понятное и иллюстрированное объяснение свойства Position, которое поможет вам раз и навсегда запомнить его основные возможности и отличия:

https://www.youtube.com/watch?v=yFXEur3SCGI

#видео #css

​Оптимизации в вебе — дорого, сложно, и уже не нужно?

Конечно нет. Далеко не у всех мощные компьютеры с кучей свободной оперативной памяти, большиство пользуются средними устройствами и смартфонами, где важен чуть ли не каждый килобайт памяти. Поэтому оптимизация крайне важна.

Автор попытался оспорить популярные доводы против необходимости оптимизации и вот, что из этого вышло:

https://tprg.ru/WU2i

​Изучение свойства CSS box-shadow, на примере красивой кнопки

Продолжаем изучать свойства CSS с помощью Джой Шахеба и его видео с красивыми иллюстрациями. На этот раз изучим box-shadow:

https://tprg.ru/HqK0

#видео #css

​Ребята, в команду Tproger нужны веб-разработчики

У нас есть две свободные позиции: Middle Web Developer (Word Press, Node.js) и Middle Frontend Developer (TypeScript, Svelte). Работать можно по гибкому графику как из офиса в Москве, так и удаленно. Интересными задачами и конкурентной зарплатой обеспечим. И даже сможем компенсировать траты на спецкурсы и литературу.

Если появятся какие-то вопросы, то задавайте их в комментариях — на все подробно вам ответим.

#вакансия #работа

​Qwik — новый фреймворк от создателя Angular

В мае этого года создатель Angular покинул Google и команду Angular и спустя некоторое время объявил о создании нового фреймворка Qwik. Новый фреймворк пока что находится на стадии разработки, но уже сейчас можно его пощупать и оценить основные концепции.

В этой статье автор как раз этим и занялся:

https://tprg.ru/V3Hf

Это он ещё float: left не использовал

​Простое руководство по компонентным свойствам в React

props, как и state являются важной частью библиотеки React. Они позволяют компонентам взаимодействовать между собой.

Если вы недавно начали изучать React, то в этой статье вам объяснят, что такое пропсы и как ими пользоваться куда проще и нагляднее, чем в официальном руководстве:

https://tprg.ru/KjzU

#react

Разработка Tizen-приложений для Samsung Smart TV на JavaScript

JavaScript по праву называют универсальным языком, ведь его возможности не ограничиваются веб-разработкой. В сегодняшней статье вы узнаете, как его можно использоваться даже для создания приложений для телевизоров Samsung.

Подробнее:

https://tprg.ru/CZcQ

#javascript

​Равные столбцы с Flexbox: это сложнее, чем вы думаете

«Используй Flexbox для расположения элементов», — говорили они. «Это легко», — говорили они.

Ну да, как же! Попробуйте настроить флексы так, чтобы три блока были абсолютно одинаковы по ширине, несмотря на количество контента в каждом! Flex-shrink тут не поможет.

Почему такое может произойти? Разобрались в статье:

https://tprg.ru/W5N0

#css

​Видеокурс по TypeScript

TypeScript — это вариация JavaScript со строгой типизацией и рядом других особенностей. Если вы уже знакомы с JS и теперь хотите изучить TS, то этот плейлист вам поможет.

Здесь вы найдёте 13 видео, рассказывающих и объясняющих различные особенности TypeScript:

https://tprg.ru/rmPT

#typescript

Плюсы, минусы, советы и хитрости при использовании Prettier в большой кодовой базе

Prettier — это инструмент, который знааачительно облегчает разработку в команде. С ним вам не надо думать, что ставить — 2 пробела, 4 или вообще табуляцию, он приведёт эти и другие моменты в коде к общепринятому в команде виду, а вам достаточно просто писать качественный код так, как вы привыкли.

Но у всего есть и обратная сторона. В этой статье автор поделился какими недостатками обладает Prettier и как их можно нивелировать:

https://tprg.ru/pFqk

​Топ-5 встроенных баз данных для приложений JavaScript

Настройка и масштабирование базы данных нелёгкая задача, а иногда и просто бесполезная. Например, когда вам требуется хранение небольшого количества данных для работы какого-нибудь такого же небольшого приложения.

Для этих целей придумано немало встроенных баз данных. О них подробнее вы узнаете в этой статье:

https://tprg.ru/BEbx

#javascript

Классовая ненависть какая-то

Как работают функции provide и inject во Vue 3?

Vue 3 принёс много нового для разработчиков. Теперь вам можно даже обойтись без VueX благодаря функциях provide и inject. Работают они достаточно просто и интересно.

В статье вы узнаете подробности:

https://tprg.ru/VLap

#vue

​Двойные, одинарные или обратные кавычки в JavaScript. Что лучше?

На первый взгляд между одинарными и двойными кавычками нет особой разницы, но это не совсем так. Например, если в тексте присутствуют кавычки, то их необходимо экранировать, либо оборачивать текст в другой тип кавычек. А обратные кавычки вообще позволяют применять иной синтаксис при встраивании данных в строки.

Так что лучше? Ответ в статье:

https://tprg.ru/1n25

#javascript

Интерактивная викторина на JavaScript

Одним из интересных и полезных вариантов пет-проекта является создание викторины или опросника. Сегодня мы предлагаем вам познакомиться с готовым примером викторины, которую вы можете изучить и повторить. На худой конец вы можете просто позаимствовать этот код и вставить у себя на сайте, ведь выглядит он привлекательно.

Здесь можно попробовать пройти викторину и изучить код:

https://tprg.ru/Eelb

#codepen

Популярные макеты и шаблоны, созданные с помощью CSS

Смотрите какую полезную штуку мы нашли для вас! Здесь собрано огромной количество готовых макетов и шаблонов CSS для самых разных задач — инпуты, кнопки, макеты страниц и многое другое.

Вам достаточно выбрать подходящий шаблон или макет и скопировать предоставленный код к себев проект!

https://tprg.ru/E0X5

#css