Working Code! Старт с нуля.
6 subscribers
4 photos
4 links
Вы сможете увидеть и принять участие:

Как проходит обучение языкам программирования.

Полезные ссылки.

Сможете помочь в обсуждениях с вопросами, которые были сделаны не правильно или их можно выполнить проще.

Проекты в разработке по достигнутым знаниям
Download Telegram
Всем привет!

На данный момент мои знания языков малы.

HTML - 80%.
CSS - 50%.

Благодаря приложению «SoloLearn» теория с небольшой практикой всегда под рукой.

Ставлю себе задачу:
До 29 февраля повторить и доучить HTML и CSS, постараться успеть доделать пробный сайт и делиться с Вами проделанной работой.

Ссылки на приложение «SoloLearn»:

IOS

https://apps.apple.com/ru/app/sololearn-learn-to-code/id1210079064

Android

https://play.google.com/store/apps/details?id=com.sololearn&hl=ru
This media is not supported in your browser
VIEW IN TELEGRAM
Решал две задачи:

1.Сдвиг шапки сайта.
2.Перекрытие двух фонов в родительском блоке.


Проблема появлялась при изменении окна браузера. Как видно на видео before.

Решение для первой задачи, оказалось очень простым.

Указал минимальную и максимальную ширину в CSS:

.header {
min-width: 1131px;
max-width: 100%;
}

/* количество пикселей нужное лишь для моего случая */

На видео в конце видно, как всё наладилось.

Проблему второй задачи записать не удалось, потому что, после исправления, ошибка больше не появлялась. Для меня это так и осталось загадкой.

Решение оказалось так же простым.

В моём случае первый фон это картинка с определенными размерами, а второй сверху заливка чёрного цвета с прозрачностью 0.5.

Отталкиваться приходится от картинки, чтобы она подходила под шаблон сайта.
Задаём ей правильные размеры. В блок с картинкой вставляем второй <div> и в CSS:

background-position: 100%;

В результате, все блоки объединяются и при сдвиге окна, меняют масштаб одинаково.

Вывод:
Все ошибки, которые я совершил, это из-за не знания до конца CSS и как дружить с родительскими и дочерними блоками.
Какой был насыщенный конец месяца.

Из запланированного я успел:
Повторить HTML;
Доучить CSS;
Не доделал сайт.

С полученными знаниями, уже будет на много легче написать код.

Отдохнул 4 дня и снова в путь!
Ставлю план до 31 марта:
-Выучить JavaScript (JS);
-Дописать сайт.

Кто любит сертификаты меня поймёт, получил два таких за достижения. Приятно.
Начало положено!

Распределил сегодня темы до конца месяца по JavaScript.

Ещё только введение, а уже предчувствие, что открываются такие возможности.

Множество инструментов ещё ждёт. Пример с окном предупреждения через функцию alert() уже вызывает восторг.

Лекции по CSS заняли у меня 80 страниц, интересно на сколько JS выйдет?
Познание в сравнении. Идея.

С каждым днём погружаюсь всё глубже в JS. Узнаю больше операторов и как ими пользоваться.

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

В конце февраля решил вспомнить, как работать с таблицами Excel. Благодаря этому проще стало усваивать некоторые операторы в JS:

-Булевые (Boolean);
-Условные (Тернарные).

Это не наставление - учить сперва Excel, а лишь совпадение. Если Вы знаете функции и работу в таблицах - лишнем это не будет, как показала практика.

Появилась одна идея. Создать не большой помощник для любителей путешествовать. Но это лишь после создания основного пробного сайта. Понимаю, нужно больше знаний для этого.
Hello! Я рад, что многие остались на этом канале 🤗.

Планирую вернуться и рассказывать о своих достижениях в программировании.

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

Но и были плюсы в этом. Я прочёл несколько книг. Записался на несколько обучающих курсов. Посмотрел три сериала 🙈.

После просмотра на канале Дудя ролик о кремниевой долине (ссылку приложу ниже). Пришлось пнуть лень и открыть глаза 👀. Ведь нужно развиваться и двигаться дальше и к лучшему!

Держитесь там и не сходите с ума! Мы вытянем и победим!

https://youtu.be/9lO06Zxhu88
This media is not supported in your browser
VIEW IN TELEGRAM
Slider!

Ух, целый вечер сидел над этим слайдером и смог наконец сделать🙌🏻!

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

Главная проблема была в размещении всех блоков в нужном порядке. Ведь на одной картинке лежит несколько слоев: 2 текста, логотип в кружке, полоса и затемнение.
Решилось. Дело в правильном позиционировании и группировки блоков.

Когда картинки встали на свои места, возникла следующая проблема. Так как они лежали горизонтально друг за другом, то стали вылазить за границы самой веб-страницы. Тем самым увеличивая его в права. Приходит на помощь свойство overflow: hidden (отображает только область внутри элемента, скрывая все остальное). Лишь нужно поместить в верный блок (задающий главный размер слайдеру 😉).

Следующим нужно было расставить правильно keyframes ключи для анимации.

Вуаля и Вы можете наблюдать простой Slider.

Надеюсь, следующий слайдер будет сделан на языке JavaScript 😏. Спасибо, что читаете🥰
Привет! Забавно будет звучать, но я вернулся 🙃.

Да. Согласен, перерыв был большой. Винить можно только свою лень и безалаберность.

Больших обещаний бросать не буду, но цели поставлены. Позже на этом канале расскажу планы подробнее.

Начнем с грустных новостей. Пытался пройти отбор в EPAM, увы, не дошел и до второго тура. Благодаря этому я услышал feedback. Зажглась тоненькая спичка, которая надеюсь приведет в к интересным огням будущего.

Прикладываю к посту фото письма тем, которые нужно будет изучить лучше. А так я начал JavsScript с нуля, чтобы не упустить все тонкости языка.
И мини игру «Угадай число от 1 до 100». 70% кода это JS.

А, вообще, если вы чувствуете, что вас планирую завалить, оговаривайтесь о темах, которые вы хорошо знаете. Ведь, если человек, Вас внимательно слушает и у него есть коварный план «Завал». Он скорее всего будет спрашивать на эти темы.

But it's all just conjecture (Но это лишь догадки).

Игра ⬇️
https://mdn.github.io/learning-area/javascript/introduction-to-js-1/first-splash/number-guessing-game.html