codequick-darkmode-logo
로그인회원 가입
웹 개발 기초 | HTML | CSS | JavaScript

교육 과정:

웹 개발 기초 | HTML | CSS | JavaScript

28 레슨 204 온라인 코딩 질문

이 강좌에서 다룰 주제는 무엇입니까?

자바스크립트 기초 파트 1

  1. 개발의 첫 걸음:

    • 출력 동작 console.log

    • 타입 var의 변수 정의하기

    • 변수를 console.log와 결합하기

  1. 기본 수학 연산:

    • 숫자 변수 정의

    • 산술 연산 - addition, subtraction, multiplication, division

    • console.log를 사용한 산술 연산

  1. 문자열:

    • 문자열이란 무엇인가

    • 문자열 변수 정의하기

    • 문자열 인덱싱 이해하기

    • 대괄호 [] 연산자 사용하기

  1. 조건 및 부울 변수:

    • if 조건 이해하기

    • 크다 연산

    • 작다 연산

    • 동등 연산

    • 부등 연산 (같지 않음)

    • 크거나 같음 연산

    • 작거나 같음 연산

    • 간단한 조건 사용하기

  1. 고급 조건문:

    • 고급 조건문 및 논리 연산자 (&& and ||)

    • if와 else 사용하기

    • else if를 사용한 복잡한 조건문

  1. 모듈로 연산:

    • 나머지를 계산하기 위해 모듈로 연산(%) 사용하기

    • 숫자의 자릿수를 계산하기 위한 메소드 사용하기

    • 숫자의 결과를 반올림하기 위해 parseInt 사용하기

  1. While 루프:

    • while 루프 작성 방법

    • 인덱스 개념과 그 사용 이해하기

  1. For 루프:

    • for 루프 정의 및 사용법

    • 루프 초기화, 증가, 종료 이해하기

  1. 모듈로 고급 주제:

    • 더 복잡한 작업을 위한 모듈로 사용하기

    • 숫자의 자릿수 합계 계산 방법

자바스크립트 기초 파트 2

  1. 배열:

    • 배열 정의하기

    • 배열에서 인덱스의 개념과 그 사용 이해하기

    • 루프를 사용하여 배열 반복하기

  1. 객체:

    • 빈 객체 정의하기

    • 객체에서 키 초기화하기

    • 점 연산자를 사용하여 키 접근하기

    • 동적으로 키 접근하기

  1. 객체 고급 주제:

    • 객체의 배열

    • 객체 배열을 반복하기 위한 루프 사용

    • Object.keys 메서드

    • Object.values 메서드

    • JSON.stringify 메서드

    • JSON.parse 메서드

  1. 함수 파트 A:

    • 함수 정의하기

    • 함수에 대한 인자 정의하기

    • 함수의 반환 값

    • 더 복잡한 함수 작성하기

  1. 함수 파트 B:

    • 여러 함수 호출하기

    • 다른 함수 내에서 함수 호출하기.

    • 함수 체이닝

  1. 중첩된 For 루프:

    • 중첩된 for 루프 정의하기

    • 인덱스의 적절한 사용

    • 배열을 사용한 복잡한 예제들

HTML, CSS, JS 통합

  1. 코드를 사용하여 요소 구축하기:

    • HTML, CSS, JavaScript의 영역을 결합하기

    • DOM (Document Object Model) 이해하기

    • 코드를 사용하여 간단한 HTML 요소 생성하기

    • innerText와 classList 사용하기

    • appendChild 함수 사용하기

  1. 루프를 사용하여 리스트 구축하기:

    • 동적 ul 요소 생성하기

    • 동적 li 요소들 생성하기

    • 동적 생성을 위한 함수 사용하기

  1. 페이지에서 요소 검색하기:

    • getElementById 함수를 이용한 검색 이해하기

    • getElementsByClassName 함수를 이용한 검색 이해하기

    • getElementsByTagName 함수를 이용한 검색 이해하기

    • querySelectorAll 함수를 이용한 검색 이해하기

    • querySelector 함수를 이용한 검색 이해하기

    • createElement 함수를 이용한 생성 이해하기

  1. 동적 테이블 구축하기:

    • 테이블 요소 동적 생성하기

    • 배열과 함수를 사용하여 테이블 구축하기

  1. 이벤트 파트 A:

    • 버튼에 클릭 이벤트 바인딩

    • addEventListener 사용하기

    • 사용자와의 이벤트 후 페이지에 동적으로 콘텐츠 삽입하기

  1. 이벤트 파트 B:

    • inputs와 events의 사용

    • 동적 요소의 통합

    • 더 복잡한 예시들

자바스크립트에서 고급 주제

  1. 콜백 함수:

    • 콜백 함수란 무엇인가

    • 언제 사용하는가

    • 인자를 어떻게 전달하는가

    • 코드의 정확성을 어떻게 확인하는가

  1. 타이머:

    • setTimeout 함수 이해하기

    • setInterval 함수 이해하기

    • 언어에서 비동기적 특성 이해하기

  1. 서버와의 통신 파트 A:

    • xmlHttpRequest 객체 이해하기

    • 실제 서버와 통신하여 데이터 가져오기

    • 페이지에 동적 요소 구축하기

  1. 서버와의 커뮤니케이션 파트 B:

    • 이벤트 및 커뮤니케이션 사용

    • 서버와 상호 작용하는 동적 페이지를 위한 복잡한 플로우 생성

    • JavaScript에서 비동기적 동작 이해하기

  1. 프로미스 사용하기:

    • Promise 객체 이해하기

    • then과 catch 사용하기

    • 프로미스를 사용한 통신 생성하기

    • 프로미스를 사용한 복잡한 흐름 생성하기

  1. 맺음말