더듬이의 헬로월드

Hello, World!

728x90

프로젝트 3

[2] 더프텔 - 네모네모 그리기

내가 만들 페이지는 다음과 같다  웹 페이지를 만들 때, 가장 중요한 단계 중 하나는 페이지의 전체 구조를 시각적으로 잡는 것단순히 디자인만 복제하는 것이 아니라, 실제로 HTML 요소들을 어떻게 배치하고 나눌지 미리 생각하는 필요하다.특히 각 섹션을 네모네모로 나누어 DIV 요소의 영역을 가늠하는 것이 중요하다피그마를 통해 네모네모 DIV 구조 잡기그래서 이번 프로젝트에서는 Figma와 같은 도구를 사용해 페이지의 DIV 구조를 시각적으로 구상할 예정이다Figma를 통해 각 섹션이 어떻게 나눠질지, 각 영역에 어떤 HTML 태그를 사용할지 미리 정리하도록 하겠다.예를 들어:헤더 영역: 상단에 고정될 header와 그 안에 들어갈 nav 태그, 로고와 메뉴를 배치할 div 등을 구상메인 콘텐츠 영역: 클..

[1] 더프텔 - 초기 프로젝트 셋팅

1. 프로젝트 생성더프텔 프로젝트의 첫걸음을 내딛기 위해 Rider를 사용해 프로젝트를 생성했다.사실 Rider는 원래 유니티 개발할 때 주로 사용했던 IDE이지만, 익숙한 환경에서 새 프로젝트를 시작하는 것이 더 빠르게 작업을 진행할 수 있다고 판단했다.Rider는 다양한 언어와 프로젝트를 지원하므로, HTML/CSS 프로젝트에도 문제없이 활용 가능하다.Tip: Rider가 없다면 VS Code나 WebStorm 같은 다른 IDE를 사용해도 좋다. 중요한 것은 본인이 편하게 사용할 수 있는 도구를 선택하는 것이다.프로젝트 생성 과정Rider 실행 → 새 프로젝트 생성.프로젝트 폴더를 지정한 후, HTML/CSS로 기본 틀을 잡고 index.html과 style.css 파일을 생성했다.이제 HTML과 C..

[0] 더프텔 - 라프텔 클론 코딩 프로젝트

깃허브 : https://github.com/Thedum2/Theftel웹 개발 공부를 시작하면서 HTML과 CSS의 기초를 익혔다. 처음에는 수많은 HTML 태그와 CSS 속성을 외우려 했지만, 현실적으로 모든 것을 기억하는 것은 불가능하다는 걸 느꼈다. 그래서 중요한 것은  모든 걸 다 외우는 것보다 기본기를 이해하고 직접 구현해보는 것임을 깨달았다. 그래서 선택한 방법은 바로 클론 코딩이었다. 내가 좋아하는 웹사이트를 직접 따라 만들어보면서 실제 적용되는 HTML/CSS 구조와 스타일링을 익히는 것이 목표였다. 그 첫 번째 프로젝트로 라프텔 페이지를 클론하기로 했다. 왜 클론 코딩을 선택했나? 직접 안만들고?디자인 할 줄 몰 라 / 바빠 임마완벽하게 똑같이 만들 필요는 없었고, 내가 구현하면서 부족..

728x90