Dev/Web6 6. JavaScript 기초 (2) 비동기에 대해 배울 것 : 개발 공부 처음 할 때 듣는 언어 절차지향이라는 것이 있을 것 : 한줄한줄 차례대로 해석 : 근데, 게임을 예시로 들면 내가 움직일 때 다른 사람이 못 움직이지 않음 : 이러한 예시를 들었을 때, 소스가 2개 이상 실행될 때를 비동기라고 함 : 이렇게 비동기로 개발을 해야 하는 경우가 생김 : 타자 게임을 제작할 예정인데, 단어 일치 여부를 확인하는 match 소스와 counting 소스 두 가지가 진행될 예정임 h1은 텍스트를 크게 보여줌 : 아래는 초안 DOCTYPE html>html lang="en">head> meta charset="UTF-8"> meta name="viewport" content="width=device-width, initial-scale=1.0">.. 2025. 3. 9. 5. HTML/CSS 소스코드 만들어보기 지금까지 배운 기초 개념들을 실제로 사용해 보면서 다시 한번 스스로 이해하기 위해, 간단하게 오른쪽 google.com 페이지의 첫 화면을 카피해 보았다. HTML Google 정보 스토어 Gmail 이미지 .. 2025. 3. 4. 4. JavaScript 기초 (1) 이제 메뉴바 버튼을 누르면 메뉴1, 2, 3이 펼쳐지는 기능을 구현하자 : 메뉴와 아이콘을 안 보이게 먼저 설정할 것 : display none 근데 이 기능 html으로 구현이 될까? : 안됨 : JavaScript 사용 : JS는 근본적으로 DOM을 '조작'하고 싶어 함 : HTML 소스에 있는 태그에 접근해서 어떤 태그 추가, 없애줘라 등 조작을 하는 것 : 즉, JS는 태그를 바꿔 치는 등 여러 동작이 가능하다 JS를 사용하기 위해서는 html 아래 쪽에 태그를 추가 : 여기 안에는 JS 문법만 작성 가능 메뉴바 클릭을 반복할 때마다 active가 생기고, 사라지고가 반복됨 : JS가 DOM 조작함 이제 그러면 id가 menus, icons이면서 class가 active면 display를 fl.. 2025. 2. 27. 3. CSS 기초 html 꾸미기 : CSS 사용 : 어떻게? : CSS 파일 생성해서 불러오기 or head 태그 안에 style 태그를 만들어서 CSS 문법 입력하기CSS 선택자 이해다양한 html 소스가 있을 것인데 특정 부분만을 바꾸고 싶을 때, 어디 부분을 선택할지에 대한 정의하는 것 선택자란? : 다양한 html 소스가 있을 것인데 특정 부분만을 바꾸고 싶을 때, 어디 부분을 선택할지에 대한 정의하는 것 : p 태그를 꾸미고 싶다면 p 적는 식으로이건 p 태그가 모두 red 색상으로 바뀜 : 근데 특정 p 태그만 바꾸고 싶으면 어떻게? : p 태그에 'id'라는 속성값 부여 : id가 thisis인 태그만 바꾸고 싶다 : thisis는 그냥 지은 id이며, 이걸 제대로 쓰려면 #thisis 사용 : id 'th.. 2025. 2. 24. 2. html 기초 , , 를 보면 꺽쇠 안에 단어가 들어가 있는 것을 볼 수 있다 : 꺽쇠 하나를 '태그' 또는 '요소(element)'라고 부른다 : 이 각각의 태그들은 명확한 기능을 갖고 있음이런 식으로 태그마다 고유의 기능이 있음을 이해 : 근데, input 태그 안에 보면 하늘색으로 type이 있음 : 이러한 것을 '속성값' 또는 'attribute'라고 이야기함 : 즉, input이 태그고, type이 input 태그의 속성값이다 라고 이해 : 해당 코드는 텍스트 박스를 만듦 위는 button 태그를 사용해서 버튼을 만든 예시인데, button 태그는 input 태그와 다르게 이라는 것이 뒤에 또 적혀있음 : 이건 닫는 태그이며 '/'를 붙이는 건데, 무슨 차이? : html 태그는 크게 두가지 종류가 있음 :.. 2025. 2. 23. 1. 기초 중요 키워드 웹브라우저가 무엇인가? 웹은 흔히 얘기하는 인터넷 웹 사이트를 의미하며, 이 웹 사이트를 볼 때 사용하는 크롬, 사파리 등의 소프트웨어를 웹 브라우저라고 한다. 웹이란 : 흔히 얘기하는 인터넷 웹 사이트 : 이 웹 사이트를 볼 때 사용하는 소프트웨어를 웹브라우저(크롬, 사파리 등) : 앞으로 크롬을 기준으로 개발할 예정 : 웹 사이트에서 데이터(텍스트, 링크) 등을 만들 때 사용하는 언어를 HTML이라 함. 초창기 웹브라우저를 만든 netscape라는 회사는 단순한 데이터를 보여주기만 하였는데, 가만히 있는 데이터가 아닌 레이아웃을 바꾸는 등의 부가적 기능을 만들고자 함 : HTML로만은 구현할 수 없어서 또 다른 언어인 JavaScript를 만듦. HTML으로 만든 버튼, 이미지 등을 색깔, 모서리 등.. 2025. 2. 20. 이전 1 다음
