Forwarded from DНЕВНИК web-программиста
Forwarded from FrontEnd книги для программистов
Forwarded from Laravel World
VILT (Vue.JS, Inertia.JS, Laravel and TailwindCSS)
Перспективная стек разработки Laravel-приложений
https://raison.co/vilt-stack-vue-inertia-laravel-tailwind/
Перспективная стек разработки Laravel-приложений
https://raison.co/vilt-stack-vue-inertia-laravel-tailwind/
Raison
VILT Stack - A future-proof way to build with Laravel in 2020
Let's look at the VILT Stack (Vue.JS, Inertia.JS, Laravel and TailwindCSS) and how they all work together in 2020.
Forwarded from TechSkills - книги по программированию
Forwarded from Frontender's notes [ru]
Марафон по HTML/CSS верстке сайтов!
4-6 августа 18:00
За три дня сверстаем сайт
для новичков+
На марафоне в прямом эфире:
— Напишем сайт на HTML и CSS
— Сделаем его адаптивным
— Познакомимся с JavaScript-библиотекой jQuery
— Отвечу на все вопросы
— Познакомимся с программой Figma для верстальщика
Для участия в марафоне подписывайтесь на телеграм канал: https://t.me/from0to1ru
4-6 августа 18:00
За три дня сверстаем сайт
для новичков+
На марафоне в прямом эфире:
— Напишем сайт на HTML и CSS
— Сделаем его адаптивным
— Познакомимся с JavaScript-библиотекой jQuery
— Отвечу на все вопросы
— Познакомимся с программой Figma для верстальщика
Для участия в марафоне подписывайтесь на телеграм канал: https://t.me/from0to1ru
Forwarded from FrontEnd книги для программистов
Essential TypeScript: From Beginner to Pro
Автор: Adam Freeman
Год издания: 2019
Скачать книгу pdf
Скачать книгу epub
#TypeScript #english #middle
Автор: Adam Freeman
Год издания: 2019
Скачать книгу pdf
Скачать книгу epub
#TypeScript #english #middle
Шрифт Fira Code
для визуального объединения нескольких символов в один в вашем коде.
https://github.com/tonsky/FiraCode
Инструкция по установке в VSC:
https://github.com/tonsky/FiraCode/wiki/VS-Code-Instructions
для визуального объединения нескольких символов в один в вашем коде.
https://github.com/tonsky/FiraCode
Инструкция по установке в VSC:
https://github.com/tonsky/FiraCode/wiki/VS-Code-Instructions
GitHub
GitHub - tonsky/FiraCode: Free monospaced font with programming ligatures
Free monospaced font with programming ligatures. Contribute to tonsky/FiraCode development by creating an account on GitHub.
Talking TypeScript
Книга Акселя Раушмайера о TypeScript. Половина доступна для чтения бесплатно!
Читать: https://prglb.ru/101c1
#books #typescript
Книга Акселя Раушмайера о TypeScript. Половина доступна для чтения бесплатно!
Читать: https://prglb.ru/101c1
#books #typescript
Open source таблички а-ля Exel. Вдруг кому пригодится)
Forwarded from Находки в опенсорсе
Luckysheet is an online spreadsheet like excel that is powerful, simple to configure, and completely open source.
It has lots of features!
https://github.com/mengshukeji/Luckysheet
#js
It has lots of features!
https://github.com/mengshukeji/Luckysheet
#js
Forwarded from Хабр
CSS Grid понятно для всех
Что такое Grid?
Grid представляет собой пересекающийся набор горизонтальных и вертикальных линий — один набор определяет столбцы, а другой строки. Элементы могут быть помещены в сетку, соответственно строкам и столбцам.
Поддержка браузерами
В 2020 году поддержка браузерами достигает 94 %
Grid контейнер
Мы создаем grid контейнер, объявляя display: grid или display: inline-grid на элементе. Как только мы это сделаем, все прямые дети этого элемента станут элементами сетки.
<body>
<div class="row">
<div class="row__item header">
<h1>Header</h1>
</div>
<div class="row__item nav">
<h1>Navbar</h1>
</div>
<div class="row__item article">
<h1>Article</h1>
</div>
<div class="row__item ads">
<h1>Ads</h1>
</div>
</div>
</body>
.row {
display: grid;
margin: auto;
grid-template-rows: 60px 1fr ;
grid-template-columns: 20% 1fr 15%;
grid-gap: 10px;
width: 1000px;
height: 1000px;
justify-items: center;
justify-content: space-between;
grid-template-areas:
"header header header"
"nav article ads";
}
grid-template-rows — это CSS свойство, которое определяет названия линий и путь размера функции grid rows.
CSS свойство grid-row определяет с какой строки в макете сетки будет начинаться элемент, сколько строк будет занимать элемент, или на какой строке завершится элемент в макете сетки. Является сокращенным свойством для свойств grid-row-start и grid-row-end.
Свойство CSS grid-gap является сокращенным свойством для grid-row-gap и grid-column-gap, определяющего желоба между строками и столбцами сетки.
Свойство grid-template-areas определяет шаблон сетки ссылаясь на имена областей, которые заданы с помощью свойства grid-area.
Повторение названия области приводит к тому, что содержимое охватывает эти ячейки. Точка означает пустую ячейку. Сам синтаксис предоставляет визуализацию структуры сетки.
С помощью свойства grid-area мы можем назначить каждой из этих областей свое собственное имя. Именование областей еще не создает никакого макета, однако теперь у нас есть именованные области, которые мы можем в нем использовать. Читать дальше →
http://amp.gs/Ftx0
Что такое Grid?
Grid представляет собой пересекающийся набор горизонтальных и вертикальных линий — один набор определяет столбцы, а другой строки. Элементы могут быть помещены в сетку, соответственно строкам и столбцам.
Поддержка браузерами
В 2020 году поддержка браузерами достигает 94 %
Grid контейнер
Мы создаем grid контейнер, объявляя display: grid или display: inline-grid на элементе. Как только мы это сделаем, все прямые дети этого элемента станут элементами сетки.
<body>
<div class="row">
<div class="row__item header">
<h1>Header</h1>
</div>
<div class="row__item nav">
<h1>Navbar</h1>
</div>
<div class="row__item article">
<h1>Article</h1>
</div>
<div class="row__item ads">
<h1>Ads</h1>
</div>
</div>
</body>
.row {
display: grid;
margin: auto;
grid-template-rows: 60px 1fr ;
grid-template-columns: 20% 1fr 15%;
grid-gap: 10px;
width: 1000px;
height: 1000px;
justify-items: center;
justify-content: space-between;
grid-template-areas:
"header header header"
"nav article ads";
}
grid-template-rows — это CSS свойство, которое определяет названия линий и путь размера функции grid rows.
CSS свойство grid-row определяет с какой строки в макете сетки будет начинаться элемент, сколько строк будет занимать элемент, или на какой строке завершится элемент в макете сетки. Является сокращенным свойством для свойств grid-row-start и grid-row-end.
Свойство CSS grid-gap является сокращенным свойством для grid-row-gap и grid-column-gap, определяющего желоба между строками и столбцами сетки.
Свойство grid-template-areas определяет шаблон сетки ссылаясь на имена областей, которые заданы с помощью свойства grid-area.
Повторение названия области приводит к тому, что содержимое охватывает эти ячейки. Точка означает пустую ячейку. Сам синтаксис предоставляет визуализацию структуры сетки.
С помощью свойства grid-area мы можем назначить каждой из этих областей свое собственное имя. Именование областей еще не создает никакого макета, однако теперь у нас есть именованные области, которые мы можем в нем использовать. Читать дальше →
http://amp.gs/Ftx0
Хабр
CSS Grid понятно для всех
Что такое Grid? Grid представляет собой пересекающийся набор горизонтальных и вертикальных линий — один набор определяет столбцы, а другой строки. Элементы могут...
Forwarded from КНИГИ: REACT, JS, ANGULAR, NODE, VUE
Working with Vue.js
Автор: sitepoint
Год издания: 2019
Скачать книгу pdf
Скачать книгу epub
#vue #english
Автор: sitepoint
Год издания: 2019
Скачать книгу pdf
Скачать книгу epub
#vue #english
Forwarded from Laravel, PHP, Backend - Uncolored collection
#devops
Мне кажется, любому разработчику стоит разобраться с основами DevOps, потому что это не только набор инструментов, но и культура работы с кодом. Рекомендую данную статью, чтобы понять проблематику и смысл данной области деятельности.
https://habr.com/ru/company/nixys/blog/514098/
Мне кажется, любому разработчику стоит разобраться с основами DevOps, потому что это не только набор инструментов, но и культура работы с кодом. Рекомендую данную статью, чтобы понять проблематику и смысл данной области деятельности.
https://habr.com/ru/company/nixys/blog/514098/
Хабр
С чего начать DevOps?
Понятие DevOps знакомо многим, но в своей практике я часто наблюдаю такую ситуацию, когда соискатель на должность DevOps-инженера в нашу компанию не может ответить на вопрос “А что же такое DevOps?”....
Forwarded from Хабр
[Перевод] Vue.js для начинающих, урок 11: вкладки, глобальная шина событий
Сегодня, в 11 уроке, который завершает этот учебный курс по основам Vue, мы поговорим о том, как организовать содержимое страницы приложения с помощью вкладок. Здесь же мы обсудим глобальную шину событий — простой механизм по передаче данных внутри приложения.
Читать дальше →
http://amp.gs/F73S
Сегодня, в 11 уроке, который завершает этот учебный курс по основам Vue, мы поговорим о том, как организовать содержимое страницы приложения с помощью вкладок. Здесь же мы обсудим глобальную шину событий — простой механизм по передаче данных внутри приложения.
Читать дальше →
http://amp.gs/F73S
Хабр
Vue.js для начинающих, урок 11: вкладки, глобальная шина событий
Сегодня, в 11 уроке, который завершает этот учебный курс по основам Vue, мы поговорим о том, как организовать содержимое страницы приложения с помощью вкладок. З...
Forwarded from Хабр
Новое CSS-свойство content-visibility ускоряет отрисовку страницы в несколько раз
5 августа 2020 разработчики Google анонсировали новое CSS-свойство content-visibility в версии Chromium 85. Оно должно существенно повлиять на скорость первой загрузки и первой отрисовки на сайте; причём с только что отрендеренным контентом можно взаимодействовать сразу же, не дожидаясь загрузки остального содержимого. content-visibility заставляет юзер-агент пропускать разметку и покраску элементов, не находящихся на экране. По сути, это работает как lazy-load, только не на загрузке ресурсов, а на их отрисовке.
В этой демке content-visibility: auto, применённый к разбитому на части контенту, даёт прирост скорости рендера в 7 раз Читать дальше →
http://amp.gs/FgxI
5 августа 2020 разработчики Google анонсировали новое CSS-свойство content-visibility в версии Chromium 85. Оно должно существенно повлиять на скорость первой загрузки и первой отрисовки на сайте; причём с только что отрендеренным контентом можно взаимодействовать сразу же, не дожидаясь загрузки остального содержимого. content-visibility заставляет юзер-агент пропускать разметку и покраску элементов, не находящихся на экране. По сути, это работает как lazy-load, только не на загрузке ресурсов, а на их отрисовке.
В этой демке content-visibility: auto, применённый к разбитому на части контенту, даёт прирост скорости рендера в 7 раз Читать дальше →
http://amp.gs/FgxI
Хабр
Новое CSS-свойство content-visibility ускоряет отрисовку страницы в несколько раз
5 августа 2020 разработчики Google анонсировали новое CSS-свойство content-visibility в версии Chromium 85. Оно должно существенно повлиять на скорость первой за...
Forwarded from Веб-страница
С Vue 3 больше не нужен Vuex?
Vuex — это паттерн управления состоянием и библиотека для приложений на Vue.js. Так зачем от неё отказываться? Дело в том, что новый Vue 3 из коробки предлагает реактивность и новые способы структурирования веб-приложений. Эти изменения настолько глобальны, что можно централизовать управление состоянием без дополнительных инструментов.
Подробнее в статье: https://tprg.ru/m61Q
#фронтенд #vuejs
Vuex — это паттерн управления состоянием и библиотека для приложений на Vue.js. Так зачем от неё отказываться? Дело в том, что новый Vue 3 из коробки предлагает реактивность и новые способы структурирования веб-приложений. Эти изменения настолько глобальны, что можно централизовать управление состоянием без дополнительных инструментов.
Подробнее в статье: https://tprg.ru/m61Q
#фронтенд #vuejs