더듬이의 헬로월드

Hello, World!

728x90

2024/10/28 2

[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..

728x90