프로그래밍 및 개발 공부하기

1. 보드 만들기 보드판 10x10 만들기 2. 누를 경우 숫자 표시 3. 깃발 꽂기 4. 패배구현 패배하면 ㅎ글자 출력모든 지뢰 보여주기누른 지뢰 빨간색으로 표시5. 승리구현 - 다시 누를 경우 처음화면으로 돌아가기 구현

CSS margin, padding, border 완벽 정리 1. 개요 웹 페이지에서 요소(예: 박스, 버튼, 이미지 등)는 단순한 글자 덩어리가 아니라 하나의 사각형 박스(Box)로 구성되어 있습니다. 이 박스는 CSS 박스 모델(Box Model)이라 불리며, 그 구조는 다음 4개의 영역으로 이루어집니다. ┌───────────────────────────────┐ │ margin │ ← 바깥 여백 │ ┌─────────────────────────┐ │ │ │ border │ │ ← 테두리 │ │ ┌───────────────────┐ │ │ │ │ │ padding │ │ │ ← 안쪽 여백 │ │ │ ┌─────────────┐ │ │ │ │ │ │ │ c..

CSS 가상 요소(Pseudo-Element) 완벽 정리 1. 가상 요소(Pseudo-Element)란 무엇인가 가상 요소(Pseudo-Element)는 HTML에 실제로 존재하지 않는 “가상의 부분”을 만들어서 스타일을 적용할 수 있도록 하는 CSS 선택자입니다. 즉, 문서 구조에는 없지만, “요소의 특정 부분(예: 첫 글자, 첫 줄, 내용의 앞이나 뒤)” 에 CSS 스타일을 적용할 수 있게 해줍니다. 가상 클래스(:hover, :focus 등)가 “상태”를 나타낸다면, 가상 요소(::before, ::after, ::first-line 등)는 “요소의 일부분”을 가리키는 선택자입니다. 2. 가상 요소의 표기법 가상..

CSS 가상 클래스(Pseudo-Class) 완벽 정리 1. 가상 클래스(Pseudo-Class)란 무엇인가 가상 클래스(Pseudo-Class)는 HTML 문서 구조에는 존재하지 않지만, 특정한 “상태(state)”나 “조건(condition)”에 따라 스타일을 적용할 수 있게 하는 CSS 선택자입니다. 즉, HTML 코드에 별도의 클래스 이름을 추가하지 않아도, “요소가 마우스를 올렸을 때”, “링크가 방문된 후일 때”, “첫 번째 자식일 때” 같은 특정 상황에서 자동으로 스타일을 바꿔줄 수 있습니다. 핵심 개념 가상 클래스는 :(콜론) 기호로 표시합니다. 실제 HTML 구조에는 존재하지 않는 가상의..

HTML 태그와 요소 완벽 정리: 빈 요소, 블록 요소, 인라인 요소까지 1. HTML 문서의 기본 단위HTML은 웹 페이지를 구성하는 가장 기본적인 언어이며,모든 웹 콘텐츠는 “태그(Tag)”와 “요소(Element)”라는 두 개의 기본 단위로 이루어집니다.즉, 웹 문서 한 줄 한 줄이 전부 요소의 집합이며,이 요소들은 태그를 통해 정의된 의미 있는 구조 단위입니다. 2. 태그(Tag)란 무엇인가태그(Tag)는 HTML에서 콘텐츠의 역할이나 의미를 표시하기 위한 기호입니다.태그는 꺾쇠 괄호(``)로 감싸서 작성하며, 대부분 쌍으로 열고 닫습니다.기본 형태는 다음과 같습니다.내용예시:안녕하세요 → 여는 태그(Opening Tag) → 닫는 태그(Closing Tag) “안녕..

HTML의 구조 완벽 정리: head, link, meta, style, title, body의 역할까지 1. HTML 문서의 전체 구조HTML 문서는 계층적인 구조(Tree Structure)를 가집니다.모든 HTML 파일은 시작 태그(``)부터 끝 태그(``)까지 감싸진 형태로 이루어집니다.그 내부는 두 개의 큰 영역, 즉 ` 구분 역할 문서 전체를 감싸는 루트(root) 요소 3. — 문서의 속성 및 정보 태그는 문서 자체의 정보(메타데이터)를 정의합니다.이 정보는 브라우저가 문자 인코딩, 페이지 크기, 작성..

시맨틱 요소(Semantic Element)란 무엇인가 1. 시맨틱(Semantic)의 의미“시맨틱(Semantic)”이란 ‘의미론적인(meaningful)’이라는 뜻입니다.따라서 시맨틱 요소(Semantic Element)란“브라우저나 개발자가 해당 콘텐츠의 의미를 이해할 수 있도록 이름 자체에 의미가 담긴 HTML 요소”를 말합니다.즉, 단순히 화면을 꾸미기 위한 태그가 아니라,‘이 부분이 어떤 역할을 하는지’를 명확히 알려주는 요소입니다. 2. 시맨틱 요소의 목적HTML5 이전에는 나 처럼 의미가 없는(non-semantic) 요소로 대부분의 구조를 표현했습니다.예를 들어, 웹 페이지의 상단 영역을 다음처럼 만들었습니다.......이 코드는 개발자 본인은 구분할 수 있지만,브라우저, 검색..

1. 구름 풀스택 과정 소개 - 인프런구름 홈페이지를 보면 시작시 위의 혜택을 준다고 쓰여있다. 근데 아무리 해도 이 강의를 구매가 안되었다그래서 여러 2일간 고생 끝에 확인해보니 미지급이 되어있었다. 그래도 어떻게든 해결이 된 것 같다. 2. 사전 지식 테스트 시험에 응시하라고 하였는데 사이트에 들어가보니 시험이 없다고 떴다그래서 관리자님에게 연락해보니 어떻게 해서 수정을 해줘서 응시했다한 번에 되는 절차는 거의없다고 보면 된다 3. 출석 원래 '공지사항' 아래에 출석 버튼이 떠야 한다.그러나 내 화면에는 뜨지 않았다. 위와 같은 게 정상적인 절차라고 한다.또 안되었다.관리자님께 말씀드려서 어떻게 또 해결했다. 4. EXP 이동 위에 보면 EXP 이동이라는 버튼이 있어야 했다.그러나 내 꺼..

유니티 Time.deltaTime 완벽 이해: 프레임 속도 차이로 인한 문제와 해결 방법 문제점: Update 함수의 컴퓨터 성능 차이로 인한 불균형유니티(Unity)에서 Update() 함수는 모든 프레임이 실행될 때마다 호출되는 함수입니다.문제는 컴퓨터마다 프레임 속도(FPS)가 다르다는 것입니다.어떤 PC는 초당 120프레임으로 매우 빠르게 동작하고,어떤 PC는 초당 30프레임으로 느리게 동작합니다.즉, 한 PC에서는 Update()가 120번 실행되고, 다른 PC에서는 30번밖에 실행되지 않습니다.결과적으로, 같은 코드라도 고성능 PC에서는 물체가 훨씬 많이 움직이는 현상이 발생합니다.이 차이는 결국 게임 속 캐릭터 속도, 총알 속도, 애니메이션 타이밍 등을 전부 달라지게 만듭니다. U..

공부한 링크https://www.youtube.com/watch?v=Px8P-KZviDQ&list=PLO7uIclOcS0jBmho5rZYPuPKM4k_krKXJ&index=1 1. 기획1945류의 비행기 슈팅게임을 제작2D제작일반 몬스터 제작보스 몬스터 제작아이템 습득 제작파워업폭탄UI구현스코어 구현게임 시작 화면게임 종료 화면목숨 구현사운드 구현 2. 게임 대기 화면 대기화면 음악 구현Start Game 눌렀을 경우 게임 시작 2. 게임 진행부분 시작하면 비행기가 나와서 파란색 총을 발사왼쪽 상단에 목숨 구현오른쪽 상단에 스코어 구현 적 몬스터 구현적 몬스터 탄환 발사 구현 떨어지는 아이템 구현파워업 구현 보스 구현폭탄 구현보스 hp바 구현최종 총알 구현 죽었을 경우 애니메이션 구현목숨 사라지는..