반응형 분류 전체보기130 [포트폴리오 페이지] 1단계: 프로젝트 초기 설정 1단계: 프로젝트 초기 설정1.1 프로젝트 디렉토리 생성로컬 환경에서 프로젝트 디렉토리를 생성합니다.mkdir MyPortfoliocd MyPortfolio1.2 Git 초기화생성된 프로젝트 디렉토리에서 Git 저장소를 초기화합니다.git init1.3 기본 파일 생성프로젝트의 기본 파일을 생성합니다.touch index.html styles.css scripts.js README.md LICENSE1.4 README.md 작성README.md 파일을 작성하여 프로젝트 설명을 추가합니다. 다음 내용을 추가합니다. # MyPortfolioMyPortfolio는 HTML, CSS, JavaScript를 사용하여 만든 개인 포트폴리오 웹사이트입니다. 이 웹사이트는 나의 경력, 프로젝트, 연락처 정보를 포함하고.. 2024. 6. 16. [기능별 페이지] lotto 상세 설명HTML (index.html) 🎱 Lotto Number Generator 🎱 Generate Numbers History Download History main 태그 내에 모든 요소가 포함되어 있습니다.div.generator-container 내에 로고, 버튼, 번호 표시 영역, 기록 표시 영역, 다운로드 버.. 2024. 6. 11. [기능별 페이지] memory matching game2 HTML (index.html) Memory Matching Game Rows: Columns: Card Type: Letters Numbers Colors Min: Max: Apply Reset Game .. 2024. 6. 10. [기능별 페이지] memory matching game1 알겠습니다. 사용자가 게임의 크기를 선택할 수 있도록 크기 선택 기능을 추가하고, 총 카드 개수를 짝수 개로 유지하도록 하겠습니다.HTML (index.html) Memory Matching Game Select Board Size: 4x4 6x6 8x8 Reset Game CSS (styles.css)/* 기본 스타일 설정 */body { font-family: 'Arial', sans-serif; display: flex; fle.. 2024. 6. 10. [기능별 페이지] omok 물론입니다. 각 파일의 코드에 대한 상세 설명을 제공하겠습니다.HTML (index.html) Omok Game Reset Game × 설명기본 HTML 구조:: 문서가 HTML5로 작성되었음을 명시합니다., , : HTML 문서의 기본 설정을 정의합니다.: 페이지의 제목을 설정합니다.: CSS 파일을 연결합니다.메인 콘텐츠:와 : 기존의 헤더와 푸터 내용을 유지합니다.: 페이지의 주요 콘텐츠를 감싸는 .. 2024. 6. 10. [기능별 페이지] - number guessing game 물론입니다. HTML, CSS, 그리고 JavaScript 파일의 코드에 대해 상세히 설명드리겠습니다.HTML (index.html) Number Guessing Game Min: Max: Set Guess a number between 1 and 100: Guess Reset Game 설명DOCTYPE.. 2024. 6. 10. [기능별 페이지] 게임 - tictactoe 물론입니다. 각 파일의 코드와 기능에 대해 설명드리겠습니다.HTML (index.html) Start Game Reset Game 설명DOCTYPE 선언 및 HTML 기본 구조: HTML5 문서를 선언하고, h.. 2024. 6. 10. [GitHub 웹페이지] Blog 페이지 Markdown 파일에서 제목, 날짜, 내용의 일부만 읽어와서 표시하도록 JavaScript 코드를 업데이트하겠습니다. 이를 위해 각 Markdown 파일에서 첫 번째 제목(#), 날짜(*yyyy-mm-dd*), 그리고 내용의 첫 번째 단락만 가져오도록 하겠습니다.디렉터리 구조/blog index.html blog.css blog.js/assets/markdown/posts post1.md post2.md ...HTML (index.html) Home Profile Blog .. 2024. 6. 10. [GitHub 웹페이지] Profile 페이지 아래는 Profile 페이지의 코드를 상세히 설명한 내용입니다. HTML, CSS, JavaScript로 구성된 Profile 페이지는 다양한 섹션을 포함하고 있으며, 각 섹션은 Markdown 파일에서 데이터를 동적으로 가져와 렌더링합니다.### 디렉터리 구조```/profile index.html profile.css profile.js markdown profile.md```### HTML (`index.html`)Profile 페이지의 HTML 구조입니다. 공통된 header와 footer를 사용하고, main 태그 내부에 Markdown 데이터를 렌더링할 수 있는 container를 포함합니다.```html .. 2024. 6. 10. [GitHub 웹페이지] 6. 프로필 페이지 - 와이어프레임 프로필 페이지의 와이어 프레임을 설명해드리겠습니다. 프로필 페이지는 사용자의 정보를 상세히 보여주는 페이지로 구성할 수 있습니다.프로필 페이지 와이어 프레임-----------------------------------------| Header |-----------------------------------------| Navigation || Home | Profile | Blog | Contact |-----------------------------------------| Profile Section || [Profile Image] .. 2024. 6. 9. 이전 1 2 3 4 5 6 ··· 13 다음 반응형