Hello World

*브라우저 개발자 도구 개요1. 콘솔(Console)목적: 스크립트 에러를 확인하고, JavaScript 코드를 실행하여 결과를 즉시 볼 수 있게 해줌.핵심 기능: 코드 실행, 로그 확인, 디버깅.2. 소스(Source)목적: 페이지에 적용된 JavaScript, CSS, HTML 소스 코드를 확인하고 디버깅.핵심 기능: 중단점 설정, 코드 단계별 실행, 스코프 확인.JavaScript 언어의 특징1. 동적 타입(Dynamic Types)설명: 변수의 타입은 런타임에 결정되며, 값에 따라 자동으로 타입이 추론됨.명시적 타입 변환의도적 타입 변환// 숫자를 문자열로 변환let num = 123;let str = String(num); // '123'으로 변환console.log(str); //..

레이아웃 설정Display 속성block, inline: 요소의 표시 유형 설정.none: 요소가 문서에 존재하지 않는 것처럼 처리.Visibility 속성요소를 보이거나 (시각적으로만)숨기되, 레이아웃에서 공간을 차지.Float 속성요소를 좌우측으로 배치하여 레이아웃의 흐름(위에서 아래로 만 가능)에서 벗어나게 함.left,right값 사용 *Position 속성static, relative, absolute, fixed, sticky: 요소의 문서 내 위치를 결정하고, 필요한 경우 위치 조정. This div is positioned static. This div is positioned relative. This div is positioned absolute. This div..

CSS 기본 이해CSS는 "Cascading Style Sheets"의 약자로, 웹 문서의 스타일을 정의하는 언어입니다. CSS를 사용하면 HTML 요소의 배경 색상, 글꼴, 여백 등을 조정할 수 있습니다.CSS 적용 방법내부 CSS: HTML 문서의 태그 안에 태그를 사용하여 작성합니다.외부 CSS: 별도의 .css 파일을 생성하고 HTML 문서에서 링크합니다.(가장 많이 사용함)인라인 CSS: HTML 태그의 style 속성에 직접 스타일을 작성합니다. 유지보수가 어렵기 때문에 지양하는 것이 좋습니다.CSS 선택자CSS에서 선택자는 스타일을 적용할 HTML 요소를 결정하는 데 사용됩니다.기본 선택자전체 선택자 (*): 모든 HTML 요소에 스타일을 적용합니다.(사용에 주의)태그 선택자: 특정 태그..

모의고사6번 이중배열의 덧샘(빈칸 채우기)https://school.programmers.co.kr/learn/courses/19275/lessons/240611 프로그래머스코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요.programmers.co.kr 7번 조건문(빈칸 채우기)https://school.programmers.co.kr/learn/courses/19275/lessons/240612 프로그래머스코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요.progra..

1.HTML 두번째제목 태그 (Headings)h1부터 h6까지 제목 태그는 문서의 구조를 나타냅니다.h1 태그는 페이지 당 한 번만 사용하는 것이 좋습니다.제목 태그는 순서대로 사용하여 문서의 계층 구조를 명확히 해야 합니다.텍스트 서식 태그 태그: 텍스트에 취소선을 추가합니다. 태그: 삭제된 텍스트를 나타내며, 취소선이 자동으로 적용됩니다. 태그: 새로 추가된 텍스트를 나타내며, 밑줄이 자동으로 적용됩니다.하이퍼링크 (Anchor Tag) 태그의 target 속성을 사용하여 링크된 문서가 어디에 표시될지 지정합니다.멀티미디어 태그와 태그를 사용하여 이미지나 동영상에 캡션을 추가합니다. 태그와 태그를 사용하여 다양한 소스의 비디오를 포함할 수 있습니다. 태그는 소리 파일을 임베드하며, control..

1.인라인 요소 (Inline Elements)인라인 요소는 문서의 흐름을 방해하지 않고 텍스트 라인 내에서 콘텐츠를 포함합니다. 이 요소들은 주변 내용과 함께 같은 라인에 위치하고, 필요한 만큼의 너비만 차지합니다. 대표적인 인라인 요소로는 , , , , 등이 있습니다. 예를 들어, 태그는 하이퍼링크를 만들 때 사용되며, 텍스트의 흐름을 방해하지 않습니다.2.블록 요소 (Block Elements)반면에 블록 요소는 새로운 라인에서 시작되며, 가능한 많은 너비를 차지하려고 확장합니다. 이들은 주로 구조적 목적으로 사용되며, 섹션을 나누거나 주요 구성 요소를 정의하는 데 사용됩니다. 대표적인 블록 요소로는 , , ~, , , 등이 있습니다. 예를 들어, 는 웹 페이지를 여러 섹션으로 나누는 데 자주..

1.vscode란?비주얼 스튜디오 코드Visual Studio Code는 마이크로소프트Microsoft에서 오픈소스로 제공하는 통합 개발 환경(IDE) 입니다. 2.익스텐션 이란?VS Code는 어떤 언어를 사용해도 코드를 쉽게 쓸 수 있게 만들어진 에디터입니다. 언어별로 특화된 기능들은 추가 프로그램을 설치해서 사용할 수 있는데요. 이런 프로그램들은 VS Code의 기능을 확장시켜 준다고 해서 익스텐션(extension)이라고 부릅니다. Live Server로컬 개발 환경에서 HTML, CSS, JavaScript 파일을 실시간으로 브라우저에서 미리 볼 수 있습니다. 주요 기능은 다음과 같습니다:자동 새로고침: 파일을 저장할 때마다 자동으로 웹 페이지를 새로 고침하여 변경사항을 바로 볼 수 있습니다. ..

1.npm이란?pm은 Node Packaged Manager의 약자이름처럼 npm은 Node.js로 만들어진 모듈을 웹에서 받아서 설치하고 관리해주는 프로그램 2.npm 사용법(명령어)대표 2개만 나머지 명령어는 필요에 따라 구글링. npm initpackage.json 생성npm install 'moduleName'npm i ' moduleName'--save or -S : dependencies에 추가--save-dev or -D : devDependencies에 추가-g : global 패키지에 추가 3.package.json이란?package.json이란 현재 프로젝트에 관한 정보와 패키지 매니저(npm, yarn)을 통해 설치한 모듈들의 의존성을 관리하는 파일이다. * 기록된 package.js..

ㅇㅇ https://github.com/josungman/Programmer-s_Web_App_Dev_Course/tree/main GitHub - josungman/Programmer-s_Web_App_Dev_Course: 클라우딩 어플리케이션 엔지니어링 코스 클라우딩 어플리케이션 엔지니어링 코스. Contribute to josungman/Programmer-s_Web_App_Dev_Course development by creating an account on GitHub. github.com

1.데이버베이스란데이터베이스는 데이터를 구조화하여 저장, 관리, 검색을 효율적으로 수행할 수 있도록 도와주는 시스템, 이를 통해 사용자는 다양한 형태의 정보를 쉽게 저장하고, 필요할 때 빠르게 접근하여 사용할 수 있다. 2.도커 이용한 Maria DB 설치도커란?도커는 컨테이너 기반의 오픈소스 가상화 플랫폼으로, 다양한 운영체제에서 여러 애플리케이션을 담을 수 있는 격리된 공간인 컨테이너를 제공한다.각각의 격리된 여러개의 소프트웨어 컨테이너에는 ubuntu, centos등의 운영체제,  그리고  java, python, 아파치 웹서버나, mysql 같은 dbms 등의 프로그램들 까지도 담기게 된다. 도커 다운로드 및 설치구글링https://da2uns2.tistory.com/entry/Docker-%EB..