HTML Basics - PART 4 HTML 요소 총정리

PART 4 HTML ELEMENTS ❖ HTML을 사용하여 간단한 웹 페이지를 구축하는 기본 요소는 다음과 같습니다 제목 만들기, 그림 삽입, 목록 만들기, 표 만들기, 텍스트 삽입, 하이퍼링크 만들기 ❖ to tags ▪ 제목에만 HTML 제목 사용 • 제목을 사용하여 텍스트를 크게 또는 굵게 만들지 않음 ❖ 태그 ▪ 단락을 정의합니다 ▪ 문단 앞과 뒤에 빈 줄이 추가됩니다 ▪ end 태그를 잊지 마세요. ▪ HTML 코드에서 Enter 키를 눌러 줄을 변경해도 웹 브라우저에서 줄이 변경되지 않습니다. ❖ 태그 ▪ 줄 바꿈을 정의합니다 • 새 단락을 시작하지 않고 줄 바꿈을 원하는 경우 사용합니다: Heading 1 My Bonnie lies over the ocean. My Bonnie lies o..

2024.04.06

HTML Basics - PART 3 HTML 기본 정리

PART 3 HTML OVERVIEW What is HTML? ❖HTML은 Hyper Text Markup Language를 나타냅니다 ❖HTML은 웹 페이지를 만들기 위한 마크업 언어입니다 ❖ HTML은 웹 페이지의 구조를 설명합니다 HTML Tags ❖ HTML은 태그로 표시되는 일련의 요소로 구성됩니다 ▪ HTML 태그는 각 괄호()로 둘러싸인 요소 이름입니다 ▪ 일부 태그는 닫힘 태그가 필요하지 않습니다 • 싱글톤 태그 또는 빈 태그 HTML Attributes ❖ HTML 특성은 요소에 대한 추가 정보를 제공합니다 ▪ 요소의 시작 태그에 나타납니다 ▪ 속성 이름과 속성 값의 두 부분을 가지고 있습니다 HTML Page ❖ 기본 HTML 페이지 구조 ❖ ▪ 브라우저가 웹 페이지를 올바르게 표시할 ..

2024.04.06

HTML Basics - Part 2 WEB DEVELOPMENT TECHNIQUES

Part 2 WEB DEVELOPMENT TECHNIQUES HTML5 ❖HTML(Hyper Text Markup Language)은 (마크업) 언어입니다 ❖마크업 언어는 태그를 보면서 텍스트를 넣을 위치를 결정합니다 CSS3.0 ❖ CSS(Cascading Style Sheets): 텍스트 스타일을 정의합니다. JavaScript ❖ 자바스크립트: 동적 웹 페이지를 만드는 데 사용됩니다 자바스크립트가 없으면 naver나 이런 웹페이지에서 검색, 로그인이 안된다. 그냥 전시용이 되어버림.. https://mkisos.tistory.com/entry/React%EB%9E%80-%EB%AC%B4%EC%97%87%EC%9D%B8%EA%B0%80-%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94..

2024.04.06

HTML Basics - PART 1 THE INTERNET AND WWW

PART 1 THE INTERNET AND WWW Benefits of learning web programming 쉽고 빠르게 배우기 가능 다양한 분야에서 아름다운 UI 만들기 가능 많은 직업들 오픈 소스가 있어서 스스로 교육에 투자가 필요하지 않음 돈 많이 벌 수 있다. History of Internet How WWW works HTTP란? HTTP는 하이퍼텍스트 전송 프로토콜(HyperText Transfer Protocol)이다. Protocol 이란? 즉, 사람과 사람이 통신할 때 서로 이해할 수 있는 언어, 공용된 언어를 사용해 전세계 모든 사람과 대화 할 수 있다라고 하면, 컴퓨터와 컴퓨터도 서로 이해 할 수 있는 언어, 공용된 언어를 사용해야 한다는 것인데, 이것이 바로 프로토콜(Prot..

2024.04.06

React 초기 설정 시 여러 오류 해결 및 궁금증 해결

오류 해결 사실 초기 오류는 구글에 오류코드만 복붙해도 다 해결 가능한 것 같지만 총정리? 느낌으로 해보고 싶어서 작성합니다. 설치가 10분 이상 오래걸린다 -> 와이파이나 데이터 통신 잘 터지는 지 확인. 핫스팟 말고 와이파이 사용함. "npx command not found 어쩌구" 에러 - 터미널 다시 껐다 켜보세요 - 대부분 nodejs 제대로 설치 안해서 그렇습니다. 옛날 버전이라 그럴 수 있습니다. 무조건 최신 버전으로 깔기!!! - 맥북이면 모르겠어요. - 윈도우는 C 드라이브에 얌전히 설치합시다. - 리눅스도 모르겠어요. 윈도우인데 "허가되지 않은 스크립트 입니다 ~" 에러 'npx'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니다. 윈도우 하단 검색메뉴..

2024.04.06

(코딩애플님 유튜브 영상 정리) React 기초 1강 : 리액트 설치와 셋팅법

React 기초 1강 : 리액트 설치와 셋팅법 리액트 설치와 셋팅법을 배울 수 있는 영상입니다. 노드 모듈 폴더에 라이브러리를 모아두고, 소스 코드는 src 폴더에 저장하는 방식으로 프로젝트를 진행합니다. 미리보기를 통해 실시간으로 웹 페이지를 확인하고, 필요한 라이브러리는 패키지.json 파일에 기록됩니다. https://www.youtube.com/watch?v=nahwuaXmgt8&t=193s React 프로젝트 생성에 필요한 프로그램은? React 프로젝트 세팅을 보여주며, 설치과정을 빠르게 소개해. 먼저 루즈 페이스에서 최신 버전을 다운로드하여 설치하고, VSCode도 설치해야 해. 에디터를 설치한 후 클릭하여 실행하면 코드 편집 화면이 나타나고, 터미널을 대신하는 VSCode를 사용하는 것을 ..

2024.04.05

React란 무엇인가? 프론트엔드 개발의 혁신

React란 무엇인가? 안녕하세요, MKISOS입니다! 프론트엔드 개발에 관심 있는 분들이라면 한 번쯤은 들어봤을 기술, 바로 React에 대해 오늘 얘기해볼까 해요. React는 현재 웹 개발 분야에서 가장 주목받고 있는 라이브러리 중 하나인데요. 왜 그런지, 그리고 React로 무엇을 할 수 있는지 함께 알아보아요! React 개요: 프론트엔드 개발의 변화 시작 React는 페이스북에서 개발한 자바스크립트 라이브러리로, 사용자 인터페이스(UI)를 만들기 위한 프레임워크입니다. React는 컴포넌트 기반의 아키텍처를 사용하여 UI를 구성하며, 이를 통해 개발자가 보다 쉽게 UI를 개발하고 유지보수할 수 있도록 돕습니다. 프론트엔드 개발 분야에서 큰 변화를 가져왔습니다. 이전에는 HTML, CSS, Ja..

2024.04.05