Как студентам нам предложили поучаствовать в одной программе. В данной программе нам преподавали курсы из различных областей как бизнеса, так и программирования. Вот некоторые из них: «Основы.NET и знакомство с платформой разработки веб‑приложений», «Азы программирования на основе 1С», «HTML и CSS», «Навыки работы с системой управления версиями Git», «Javascript, уровень 1: основы web‑программирования».
По прохождению всех курсов мы должны были показать, чему мы научились, поэтому нам заранее предложили направления и соответствующие им проекты, которые мы по завершению одного учебного года должны были защитить.
Было множество направлений, но я выбрал «Промышленную автоматизацию». Мой проект назывался: «Электронная проходная». Целью проекта было: «Сокращение сроков согласования и выдачи пропусков, снижение нагрузки на бюро пропусков».
Результат проекта должен был выглядеть следующим образом:
Подача/согласование заявки на пропуск в электронном виде.
Автоматическая генерация пропуска, направление в электронном виде Заявителю.
Проход на территорию завода при помощи Qr-кода.
Автоматический учет пропусков (формирование отчетности для службы безопасности)
Раздел 1. Первые шаги
В самом начале я думал с чего же начать, на каком языке писать (ведь на тот момент я не знал ни Javascript, ни Python + Django), как все связать воедино. Курсы, описанные выше на этот момент еще не преподавались. Все мои навыки ограничивались знаниями по C++, С#, C# Windows Forms. Недолго думая, и руководствуясь принципом: “Не знаешь с чего начать, просто начни, и идеи придут сами”, то я решил приступить к созданию страницы “Подача заявки”.
Вначале было трудно понять свойства селекторов, особенно когда display может принимать разные значения, и основываясь на этом значении настраивались свойства flex-direction, justify-content, align-items. Ух не забуду никогда, когда нужно было выравнивать по центру, это было приключением. Помогали такие сайты как habr.com, stackoverflow.com, developer.mozilla.org/ en-US /docs/Web. На тот момент еще не было того бума, когда каждый говорил про ChatGPT. Поэтому приходилось искать все ручками.
Смотря на текущий дизайн данной страницы, я понимаю, насколько вперед шагнули мои навыки в верстке сайта.
Раздел 2. Почта и Qr-код
Нужно было переходить на следующую ступень эволюции: отправка письма получателю на почту с ответом, а также Qr-код. Этой эволюцией стало знакомство с Javascript и PHP. В этом разделе я уделю больше внимания PHP, так как js-скрипт я подключил один раз, и почти его не редактировал, а вот работа с серверной частью заняла основу всего будущего времени. Здесь я и познакомился с библиотеками для PHP: PHPMailer и phpqrcode.
Понятие как подключаются библиотеки у меня не было, поэтому просто скачав Composer и написав в cmd, не тот, что в проекте, а тот, что вызывается через Win + R, нужную команду, я пытался подключить данные библиотеки. Да, бывает и такое. Но все же учатся на ошибках, вот и я научился. В общем на этом этапе у меня уже был проект, который мог получать заявку, и генерировать Qr-код, который отправлялся на почту.
Этот этап был знакомством с новыми языками, и то как подключить SMTP App Password.
С этого момента стало понятно, что запросы в поисковике писать лучше на английском языке
Раздел 3. Webflow, CSS-стили и новый дизайн
Следующим шагом в моем деле стало знакомство с Webflow, тогда‑то я и познал кухню всех этих display‑ев. Спасибо за это Webflow, но: «Как же надоели все эти подписки, все эти Премиумы», из‑за них экспортировать код было проблемой (нужно было опубликовать страницу, зайти на нее, открыть исходный код, найти ссылку с подключением CSS‑стилей, перейти на нее, скопировать содержимое и только потом экспортировать в свой проект => Фух, вроде все