분류 전체보기 30

[코딩챌린지] 사용자로부터 input 값 받기

1. HTML 구조 : HTML 문서라고 선언하는 코드 : 쓰는 코드의 기본 언어는 영어(english) 2. 헤드 영역 : 대부분의 언어 문자를 지원하도록 하는 설정 : 모바일 장치에서도 페이지를 잘 볼 수 있도록 설정 쓸 말 : 쓸 말 = 웹 페이지 제목 3. 바디 영역(웹 페이지의 본문 영역, 사용자에게 실제로 보여지는 콘텐츠가 들어가는 부분) : id는 login-form인 컨테이너로, 로그인 폼의 구조 형성 : 사용자가 텍스트를 입력할 수 있게 // type = "text" : 텍스트를 입력할 수 있는 필드// placeholder = "What is your name?" : 필드에 표시되는 텍스트(사용자가 입력하면 사라짐) Log In : 클릭 가능한 버튼  : script라는 java s..

카테고리 없음 2025.01.28

JavaScript 개념정리 (4)

1. Object(객체): 프로그래밍에서 데이터와 이를 처리하는 메서드를 하나로 묶은 개념으로 객체지향 프로그래밍(OOP)를 위해서는 필수적인 요소. 객체는 코드의 재사용성을 돕고 유지보수성을 향상시키기에 효율적인 프로그래밍을 위해서 필요하다. 객체를 위해서는 클래스가 만들어져야 한다.  sayName과 letssing을 여러 번 사용할 때 일일이 만들지 않아도 객체를 생성함으로써 코드를 재사용할 수 있게 되었다.+) 추가적인 참고 내용getter와 setter는 private한 변수에 접근할 때 필요하다. getter에 비해 setter는 자주 쓰이지 않는다.  2. Inheritance (상속)클래스에도 부모와 자식 관계가 형성된다. 자식이 부모의 재산을 상속받는 것처럼 클래스 사이에서도 가능하다. ..

카테고리 없음 2025.01.20

JavaScript 개념정리 (3)

1. Type 변환     toString()과 parseInt()와 같은 경우에는 다른 프로그래밍 언어에서도 배웠던 것을 그대로 적용하면 된다.      !!'x'가 true로 나오는 것을 보아 스트링 자체는 true로 받아들이는 것 같았는데 이 안에 아무 글자도 없으면      false로 나온다는 점이 신기했다.      반대로 스트링이 아니라 !!0 을 넣어보면 false가 나왔다. undefined와 null 역시 false로 나온다.    2. Function(함수)  Function은 우리가 특정 기능을 가지며 우리는 이를 통해 특정값을 리턴받거나 값의 변화를 얻는다. 예시를 보면 더 잘 알 수 있다.자바 스크립트에서는 function 이름 앞에 'function'이라는 키워드를 붙여줌으로써..

카테고리 없음 2025.01.20

JavaScript 개념정리(2)

1. 연산자 자바 스크립트의 특징은 '=='과 '==='이 있다는 점이다. '=='은 타입이 달라도 값이 같으면 true를 리턴한다. 그러나 '==='은 값이 같아도 타입이 다르면 false를 리턴한다.                             2. If & Switch 구문    이 구문은 자바나 다른 언어들과도 차이가 딱히 없기 때문에 이해하고 넘어가면 된다.   3. for & while loop 구문

카테고리 없음 2025.01.20

JavaScript 개념 정리 (1)

1. JavaScript란?JavaScript는 웹 브라우저에서 실행되는 동적의 강력한 프로그래밍 언어. 웹 개발에 자주 사용되고 사용자와의 상호작용, 웹 페이지를 동적으로 업데이트 하거나 무브먼트를 추가하는 기능을 가짐.(이전에 배운 HTML과 CSS가 각각 웹 페이지의 뼈대와 이를 꾸며주는 기능을 한다면 자바 스크립트는 이 구조물들이 잘 어우러질 수 있도록 움직임을 돕는 역할.) 2. JavaScript의 간단한 개념들자바 스크립트를 배우면서 느낀 것은 이전에 배운 프로그래밍 언어들과 매우 흡사하다는 것! 구성은 거의 똑같고 이를 표현하는 언어가 달라지는 느낌을 받았다.   1) 프린트 하는 법 (자바 스크립트는 console.log(' '); 이 구조로 프린트를 한다)   2) 주석 처리하는 법  ..

카테고리 없음 2025.01.20

CSS란?

CSS는 HTML 문서를 더 예쁘게 꾸며줄 수 있는 언어. HTML과 분리한 이유는 따로 언어를 나눠서 만드는 게 더 효율적이기 때문. 1. CSS 기본적인 적용법  가. Style 태그 이용하는 방법        나. 파일을 두 가지로 나눠서 외부 CSS 파일 불러오는 방법( 꾸며야할 코드가 길수록 나. 방법을 쓰는 것이 더 효율적임)       2. CSS 글씨 크기, 정렬 3.  선택자      선택자: 앞에 css 파일에서 나온 h1과 p 같이 HTML에서 꾸며질 글씨 지정하는 역할을 함       가. 전체 선택자       나. 유형 선택자       다. 아이디 선택자       라. 클래스 선택자       마. 복합 선택자    3. 가. 전체 선택자: 모든 HTML 문서 선택해 스타일 ..

카테고리 없음 2025.01.06

기본적인 태그

1. 태그의 형태   가. 시작 태그와 종료 태그가 모두 있는 형태            쓸 내용    나. 종료 태그가 없는 형태         2. 자주 사용하는 태그    가. h: 제목 태그    나. br, p, div, span: 줄 바꿈(br) , 문단 지정 (p) , 영역 지정 (div) , 범위 지정 (span)    다. link: 현재 문서와 외부 소스를 연결해주는 태그    라. img: 이미지를 나타내는 태그    마. form: 폼(입력 양식)을 만드는 태그    바. button: 버튼을 만드는 태그    사. ol, ul, li : 리스트를 나타내는 태그     2. 가 h 태그         heading의 h, 즉 '제목'이라는 뜻. HTML의 제목을 나타내며 검색 엔진이 ..

카테고리 없음 2025.01.03

웹과 HTML

1. 웹(Web)이란?웹은 인터넷에 연결된 사용자들이 서로 정보를 공유할 수 있는 서비스. 이를 통해 텍스트, 그림, 영상 등의 정보를 제공할 수 있음. 2. 웹의 동작원리인터넷은 요청(request)와 응답(response) 구조로 웹 페이지 코드가 서버(server)에서 클라이언트(client)로 전달됨.이때 HTTP 통신 규약으로 전달되는 문서가 하이퍼텍스트 양식으로 되어있음. 하이퍼텍스트는 하이퍼링크를 통해 유저가 한 문서에서 또 다른 문서로 접근할 수 있게 하는 텍스트! 하이퍼텍스트에 HTML이라는 마크업 언어가 사용됨. 여기서 마크업 언어는 태그를 이용하여 문서나 데이터의 구조를 명시하는 언어!결국 웹 페이지를 만들기 위해서는 HTML을 꼭 알아야 함. 3. HTML이란?HTML은 하이퍼텍스트..

카테고리 없음 2025.01.02