Materials for pet projects: a must have for a fresh frontender
HTML-код
- Опубликовано: 22 май 2024
- Привет, друзья!
Прошлое видео с идеями для проектов в портфолио получило большой отклик. И вы просили в комментариях подсказать, где же искать такие крутые материалы для быстрого создания ваших пэт-проектов.
💎Сегодня я делюсь с вами огромной (гигантской!) подборкой абсолютно БЕСПЛАТНЫХ ресурсов для разных этапов создания ваших проектов:
1) начиная от дизайна,
2) разработки шаблонов (верстки),
3) деплоя (хостинга),
4) и заканчивая миллионом различных деталей, таких как иконки, шрифты, фото, фоны и прочие прелести, которые делают наши проекты стильными и выделяющимися.
👍Друзья, это новый экспериментальный формат видео на нашем канале - дайте нам знать вашими лайками и комментариями, нравится ли вам такой формат и хотели бы вы получать от нас новые подборки полезных и нужных ресурсов.
По каждому из этих ресурсов я постарался рассказать коротко его фишки и ценность для вас. Смотрите с удовольствием! И сразу открывайте для себя те, которые вам нужны для ближайшего проекта!
✅Все ссылки с сегодняшнего видео вы найдете также здесь: bit.ly/pet-projects-links
Присылайте также ваши личные рекомендации полезных сервисов в комментариях - но желательно не ссылкой, чтоб RUclips не удалил комментарий, а названием сервиса. Если будут интересные ресурсы, обязательно добавим в общую подборку.
👍Обязательно делитесь этим видео с друзьями!
👍И не забудьте написать нам в комментариях что-то хорошее 🤓
🕗Таймкоды:
00:00 Intro
01:53 Дизайн
06:45 Готовые шаблоны с версткой
11:28 CSS фреймворки
17:53 Цветовые палитры
19:41 Icons
22:10 Шрифты
26:47 Лого-генераторы
31:17 Gradient-генераторы
34:15 Pattern-генераторы
41:37 CSS-анимации
45:01 Фотостоки
47:46 Deployment
51:53 Final
👍🤩 Будем благодарны за поддержку нашего канала на Патреоне: / frontendscience
---
Если видео было для вас полезным, ставьте лайк и поделитесь им с друзьями.
Подписывайтесь на наш канал: bit.ly/fs-ytb
---
Присоединяйтесь к нам в соцсетях:
FB: / frontendscience
Instagram Сергея Пузанкова: / puzankovcom
Заходите на наш сайт: frontend-science.com/
---
Music by Blue Wednesday
---
#petprojects, #frontend, #ityoutubersru
видео - просто огнище! внезапно отвлекся с чтения Гашека, и уже не могу остановиться смотреть!
це величезний кладязь знань, дякую вам за вашу роботу)
Радий, що було корисно!
Почему это видео не в топе? Крутой контент. 👏👏🔥
Доброе утро,Сергей)Вы классный человек, спец и вообще чашку кофе за Вас до дна
😀 очень вдохновляет! 👍☕️
Большое спасибо за вашу работу, буду использовать в проектах!
Длинный комментарий для продвижения канала. Спасибо большое!
Вижу новое видео вышло на канале - лайк автоматом!
Класс! Благодарим за поддержку! 😊
Благодарю за такие полезные и интересные ресурсы. Вы сделали большое добро, спасибо
Було б цікаво побачити процес деплою на той чи інший сервіс. Дякую вам за відео!
Хочу видос по Хироко.Отлично приподносите информацию.
Спасибо, очень много полезной информации) Лайк и подписка.
Спасибо огромное , сэкономили время на поиски 🙏
подборка очееееень крутаяяяяя! боже моооой!
Спасибо 🙂 интересно про деплой - хероку и другие)
Приятно видеть как растет любимый канал про JS👏
Здорово! Очень приятно ☺️
отличный контент. много интересного добавил себе.
Ну здОрово! Рад :)
Godnota!
спасибо, Отэц
Хотим видео про Heroku и Deploy))
+++
❤спасибо!
Отличное видео, много полезных ресурсов! Спасибо
Воу, какая классная обложка у ролика, с x и пальцем в слове нужных, круто придумали 🔥
Спасибо большое за видео, много интересного. Было бы очень полезно посмотреть отдельное видео про deployment
И Вам спасибо 😉
Спасибо за полезнейшее видео, лайк на автоматизме!))
Рад, что полезно! :)
Огроменное спасибо за такую полезную информацию!👍😊
Очень рад, что полезно
Выпуск просто огонь! Спасибо! Проделана, просто, титаническая работа!
Это так! Рад, что понравилось и что полезно)
Спасибо за великолепную подборку! То что нужно
Супер! 👍 Я рад!
Очень крутое видео!!! Спасибо!
ЛУЧШИЙ
Вот это подборочка, ого-го, я много нового узнал, спасибо!
Супер!!!
лайк не глядя
спасибо за материал
Great helpful content! Thanks a lot. Good job.
Офигенно!)
Очень понравилось, действительно полезно. Спасибо большое за видео 🙂
🤓 рад, что понравилось
хотим видео про деплой.
давай видео про хостинг
Вау, спасибо большое за вашу работу! Смотрю каждое видео с большим удовольствием. Очень полезный ролик)
Супер! Очень рад 😀
Извините видимо я поспешил ссылка появилась. Спасибо огромное за ролик.
Этому видео нужен патент! Из него другие блогеры сделают 5 видео)))
Класс, увидел вещи, которые давно искал. Спасибо большое за труд.
)) благодарю, порадовался)
Супер видео, еще нужно о ресурсах и полезных сайтах
Спасибо большое! Все сохранила, очень полезные материалы для новичков, да и не только)
Как же это шикарно! Большое спасибо!
Спасибо, полезный материал!!
Полезно, спасибо!
Хороший материал,Спасибо большое!
Рад, что оказалось полезным 🤓
Спасибо! Очень полезная информация для меня 🔥
Блин! Очень, очень жаль, что нельзя поставить несколько лайков одновременно! Спасибо вам огромное, не хватало именно такой информации. Вы лучший!
Благодарю) рад, что полезно!
Все норм, я поставил за Вас, Юлия, дополнительный лайк 🙂
@@ivan_kirsanov Спасибо🙂
Большое спасибо за труд и ценную инфу, лайк само собой.
пользительно! спасибо!
Спустя 3 года, не всё из этого знаю, круто), так что видео нужно было назвать материалы для современного разработчика
топ, спасибо большое
Отличное видео, как всегда! Спасибо большое! Все сохранила в закладки)
Рад, что пригодилось!
Thank you so much for such an awesome and useful content ☺️ Keep it up 👍
Thanks for your support!
Спасибо как раз задавалась вопросом найти сайты с готовыми макетами для учебы:) Супер)
Ждем виде по деплою! Спасибо за такую подборку материалов!
Сделаем )
very good stuff
Лайк
👍
Привет, пожалуйста сделай видео о пет проектах для бэкенд разработчиков.
Про deployment было бы очень полезно узнать, я все никак не мог найти хорошую информацию об этом. Спасибо за видео
Нужно видео про хероку
Хачу Хероку!😛
+++
За ссылки на все проекты - отдельное спасибо!
Рад, что было полезно)
@@frontendscience Очень!
Сергей, я там кое-что ещё спросил у вас в инстаграмме, будет возможность, посмотрите пожалуйста :)
или лучше на почту написать?
Ещё раз спасибо!
Низкий поклон за такой полезный контент. Не нашел в упоминании такой отличный ресурс как Boxicons. Около 1500 разных иконок которые подгружаются в html, так еще можно анимацию им накидывать интересную. Так-же все бесплатно :)
Благодарю за рекомендацию - добавил его в список ;)
спасибо за видео
Го видео про деплой на Neroku
Наверное на ХЕРоку
👍Друзья, делитесь этим видео в соцсетях и ставьте ваши лайки - это прям ооочень помогает в продвижении нашего канала 🙂🚀
⏱ Таймкоды:
00:00 Intro
01:53 Дизайн
06:45 Готовые шаблоны с версткой
11:28 CSS фреймворки
17:53 Цветовые палитры
19:41 Icons
22:10 Шрифты
26:47 Лого-генераторы
31:17 Gradient-генераторы
34:15 Pattern-генераторы
41:37 CSS-анимации
45:01 Фотостоки
47:46 Deployment
51:53 Final
🤓И напишите нам в комментариях, хотели бы Вы и дальше видеть такие подборки полезных ссылок в наших роликах?
✅Все ссылки с сегодняшнего видео вы найдете также здесь: bit.ly/pet-projects-links
есть ли еще смысл учить фронт-энд? или через большую конкуренцию это уже бесмысленно ?
Невероятно полезное видео! Сохранил себе в подборку, буду пересматривать время от времени
рад, что полезно)
Спасибо за подборку, было бы интересно посмотреть про открытые АПИ сервисы, возможно даже не бесплатные
Скажите, а что именно вы хотите увидеть в видео про АПИ?
Спасибо огромное! Без воды! Круто! Хотелось бы видео про heroku и deploy.
Будет)
@@frontendscience Отлично!!!! Круто!
слишклм обалденная информацияя))))
Рады слышать))
Спасибо за обзор ресурсов. Только хотелось бы добавить, что Tailwind CSS на мой взгляд должен быть где-то на первых местах, а он даже в список не попал. После моего знакомства с ним год назад, вряд ли без нужды захочется возвращаться на что-то иное.
Благодарю за рекомендацию - добавил его в список ;)
Первое место мастхев
Братан,ты ахуенный!
🤠
Очень хорошее видео. Хорошо сделано, очень информативное. Однозначно лайк. Маленькое но - на 1:53 вы говорите о ссылке на док со всеми ссылками будет в описании. Не могу его найти.
✅Все ссылки с сегодняшнего видео вы найдете также здесь: bit.ly/pet-projects-links
Сергей, спасибо за отличный видос с множеством полезной информации и интересной подачей. Интересно проводить вечера за просмотром Ваших видео). Подскажите, пожалуйста, на Heroku/Vercel/Netlify можно развернуть простейшую серверную часть с бд для своего проекта ?
Рад что было полезно. Да там есть опции с БД но сейчас не подскажу где именно это будет бесплатно. Надо изучать прайсинги
Спасибо, замечательное видео, очень полезные ресурсы рассмотрены.
Было бы здорово увидеть что-то подобное по бесплатным хостингам, если таковые вообще сейчас остались. Когда самостоятельно себе искал такой для опытов, ничего более-менее приличного найти не смог. Но вдруг что-то пропустил или не нашёл?
Посмотрите еще раз видео - там есть целый раздел про деплой проектов и ссылки на бесплатные ресурсы.
@@frontendscience Я видел. Но это какие-то странные ресурсы, которые говорят о каких-то приложениях, привязках к всяким сомнительным сторонним ресурсам и всё в таком духе.
Я же говорю об обычном хостинге, по-старинке, когда получаешь доменное имя (обычно третьего уровня) и доступ к фтп-серверу, куда и заливаешь свои файлы сайта. Не вот это вот всё современное модное молодёжное, в котором необходимо ещё стопиццот дополнительных ненужных телодвижений совершить.
@@1kvolt1978 если это для Вас «сомнительные ресурсы», как Вы выразились, уверен, Вы самостоятельно найдете те, которые вызовут у Вас больше доверия, чем приведенные мной)
@@frontendscience Сомнительные в том плане, что я сомневаюсь в их необходимости. Например, зачем нужна привязка к гитхабу для выкладывания сайта в интернет? О_о
На приведённых Вами ресурсах я вообще не увидел слова "хостинг", или "домен", или хотя бы "сайт". И речь на них о каких-то "приложениях", чтобы под этим не подразумевалось в нынешние нелёгкие времена.
А сам я, к великому сожалению, найти простые бесплатные хостинги, достойные упоминания, не осилил, не смог. :) Вот и подумал, что а вдруг профессионалы знают какие-то ресурсы или иные возможности. Может, у каких-то платных хостингов есть интересные возможности бесплатно похоститься с какими-то ограничениями, неприемлимыми для коммерческих сайтов, но некритичными для некоммерческих мини-проектов. Или что-то в этом роде.
Ну нет так нет.
Сергей, Здравствуйте! Хотел вас попросить совета по пути senior, как следует развиваться чтобы достичь senior уровня, какие основные требования в 2021 году, на что нужно уделить особое внимание, что прочесть и тд, заранее спасибо!
На самом деле по тех.скилам можно смотреть видео про требования к миддлу: ruclips.net/video/VWF1XVpASgo/видео.html
Список тот же, только от сеньора требуются более углубленные знания и более быстрые и осмысленные ответы.
Но большую часть занимают именно софт скиллы. Я много раз уже говорил, что часто миддла от синьера отличают именно софт скиллы, потому что разработчик может быть технически супер сильным , но блин из-за слабых софт скиллов не дотягивает до синьера. Так что главный упор на них. Здесь можно посмотреть, что имею в виду: ruclips.net/video/mOOrcf56OO8/видео.html
Желаю успехов!
Спасибо!@@frontendscience
да проекты на heroku хотелось бы посмотреть
будет!
было бы еще интересно увидеть интересные сборки gulp+webpack к примеру, посмотреть может у кого-то есть более интересные решения, а то я пользуюсь одной сборкой, так там постоянно ругается если не стоит python или слишком новая версия ноды.. ну такое
Здравствуйте, Сергей! Кто Вам 2 дизлайка-то поставил? :))) Я тут задачку про лабиринт решил! Чё-то долго с ней возиться пришлось. Обычно я Ваши задачи достаточно быстро решаю. Решил скинуть решение сюда, так как видео про лабиринт было уже давно :)))
const maze = [
["wall", "wall", "wall", "wall", "path", "wall"],
["path", "path", "path", "wall", "path", "wall"],
["path", "wall", "path", "path", "path", "path"],
["path", "wall", "wall", "wall", "path", "wall"],
["path", "path", "wall", "wall", "path", "wall"],
["wall", "path", "wall", "wall", "wall", "wall"]
];
function checkPossiblePath(maze) {
const mazeHeight = maze.length;
const mazeWidth = maze[0].length;
const entrance = {y: 0, x: maze[0].indexOf("path")};
const exit = {y: mazeHeight - 1, x: maze[mazeHeight - 1].indexOf("path")};
const passedPath = [{y: entrance.y, x: entrance.x}];
for (const element of passedPath) {
maze[element.y][element.x] = "passed";
if (element.y + 1 < mazeHeight) {
if (maze[element.y + 1][element.x] === "path") {
passedPath.push({y: element.y + 1, x: element.x});
}
}
if (element.y - 1 >= 0) {
if (maze[element.y - 1][element.x] === "path") {
passedPath.push({y: element.y - 1, x: element.x});
}
}
if (element.x + 1 < mazeWidth) {
if (maze[element.y][element.x + 1] === "path") {
passedPath.push({y: element.y, x: element.x + 1});
}
}
if (element.x - 1 >= 0) {
if (maze[element.y][element.x - 1] === "path") {
passedPath.push({y: element.y, x: element.x - 1});
}
}
}
return passedPath.some((element) => element.y === exit.y && element.x === exit.x) ? "has" : "hasn't";
}
console.log(`This maze ${checkPossiblePath(maze)} a through path!`);
Класс! Благодарю за решение!
@@frontendscience Вам спасибо за интересные видео! Так это смотрится в редакторе: clip2net.com/s/4dPWtsL
Я Вам в следующий раз буду стараться ссылками скидывать!
к сожалению ютюб комменты со ссылками удаляет (очень редко когда не удаляет). Так что лучше просто код кидать
@@frontendscience Ок!
Ваше мнение по MS Blazor?
Не пользовался и не планировал, если честно.
Здравствуйте! Подскажите пожалуйста, реально ли стать программистом без образования в физмате?) какие курсы можете порекомендовать с полного нуля, или книги может какие для начала?)
@@frontendscience благодарю за ответ) чуть уверенности добавили)
Если я пересмотрю, изучу и повторю все видео с этого канала, есть шансы пройти собеседование на фронт-енд разработчика?
Шансы всегда есть 😉
Привет, не открывается ссылка на линк, чекни плиз
Спасибо. Слава Украине!
Героям слава!