프론트엔드 챌린지 - 12월 에디션, Glam Up My Markup: Winter Solstice - Wintice

프런트엔드 챌린지 - 12월 에디션, Glam Up My Markup: Winter Solstice

내가 만든 것

'동지' 이벤트 랜딩페이지를 만들었습니다. 나의 주요 임무는 그것이 무엇인지 알아내는 것이 었습니다. 그것에 대해 많이 들었음에도 불구하고 그것이 어떻게 작동하는지 몰랐습니다. 다른 분들의 이해를 돕기 위해 설명하는 홈페이지에 필요한 자료를 추가하기로 했습니다.

수행된 작업:

• 튜토리얼에서 가져왔지만 약간 수정된 아름다운 애니메이션이 포함된 대화형 탐색 메뉴입니다.
• 이미지 및 동영상 추가
• 축소된 이미지 확대
• 반응형 디자인.

데모

라이브
GitHub

여행

사실 저는 다른 작업을 하려고 계획 중이었어요. 하지만 저는 이 문제를 파헤치기 시작했고, 참여했고, 그것이 저를 사로잡았습니다. 저는 이전에 DOM을 직접 사용해본 적이 없었습니다. 저는 항상 일부 프레임워크(React, Astro, Next)를 사용했습니다. 때로는 템플릿 엔진(Jinja2)을 사용하기도 했습니다. 하지만 이렇게 DOM을 직접 수정하는 것은 정말 놀라운 일입니다. 마치 인터넷의 어떤 웹페이지라도 변경할 수 있는 것과 같습니다(예를 들어 스타일이 마음에 들지 않는 경우).
TailwindCSS나 Bootstrap을 사용하지 않고 수동으로 반응형 디자인을 다시 작업하는 것은 흥미로웠습니다. 프로젝트를 끝까지 지켜보는 것은 흥미로웠습니다. 언뜻 보기에는 간단해 보일 수도 있지만, 제가 한 일을 어떻게 성취하는지 파악하고 이해하는 데는 꽤 시간이 걸렸습니다.
이번 일을 통해 웹 개발자에 한발 더 가까워진 것 같아요. 참여할 기회를 주셔서 감사합니다!

나는 비판에 열려있습니다! 보기 흉하거나 어색하다고 생각되는 점을 적어보세요. 다른 것을 배우게 되어 기쁩니다!

위 내용은 프론트엔드 챌린지 - 12월 에디션, Glam Up My Markup: Winter Solstice - Wintice의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!