웹
-
TypeScript 공부하기 - 추천 강의, 추천 사이트웹/TypeScript 2022. 9. 3. 16:26
TypeScript 추천 강의 TypeScript를 쓰는 이유와 핵심 문법에 대해 알 수 있다. 단 10분의 강의이므로 꼭 들어보길 바란다. https://www.youtube.com/watch?v=xkpcNolC270&t=307s TypeScript 추천 사이트 https://www.typescriptlang.org/docs/handbook/intro.html Handbook - The TypeScript Handbook Your first step to learn TypeScript www.typescriptlang.org TypeScript 관련 handbook 사이트이다. 웬만한 문법은 다 담겨져 있으므로 이 사이트를 보고 TS에 대해 알아가면 좋을 것 같다. TypeScript 관련 도서에서 좋..
-
TypeScript 설정하기 - 개념, tsc -w 오류 해결웹/TypeScript 2022. 9. 3. 15:37
TypeScript란? 자바스크립트의 슈퍼셋인 오픈소스 프로그래밍 언어이다. TypeScript는 실행 전에 프로그램에 오류가 있는지 확인하고 값의 종류에 따라 수행 하는 정적 유형 검사기 입니다. 확장자는 ts입니다. TypeScript 설정 node.js를 설치한다(최신버전 추천) 터미널에 아래 구문을 입력해준다. npm i -g typescript TypeScript 간단 예제 VS Code를 열어 ex.ts 파일을 생성해준다. 아래 코드를 입력한다. let Name :string = 'you'; tsconfig.json 파일을 생성한 후 아래 코드를 입력한다. { "compilerOptions" : { "target": "es5", "module": "commonjs", } } 터미널 > 새 터미..
-
JavaScript 문법 - 변수, 함수, typeof웹/JavaScript 2022. 8. 29. 19:07
변수 let + 변수명 = 값; 로 설정합니다. 자바스크립트는 변수에 자료형을 저장하지 않습니다. 즉, 하나의 변수의 처음과 다른 자료형을 저장할 수 있습니다. typeof 해당 변수의 자료형을 추출합니다. 키워드, 연산자 강제 자료형 변환 함수 Number() : 숫자로 변환 String() : 문자열로 변환 Boolean() : T/F로 변환 0, Nan,"",null,undefine : False 이외 : True const 상수를 선언할 때 사용합니다. 함수 생성 방법 함수를 만드는 방법은 3가지가 있다. 1. 익명 함수 이름을 붙이지 않고 함수를 생성하는 방법 A. 생성 let 함수명 = function () { } ; B. 호출 함수명() ; C. 출력 console.log(함수); 2. 선언..
-
JavaScript 기본 용어 -표현식과 문장, 키워드, 식별자, 주석웹/JavaScript 2022. 8. 29. 15:21
JavaScript의 기본 용어부터 알아보겠습니다. 중요 언어이므로 익히셔야 합니다. 표현식 값을 만들어 내는 간단한 코드 문장 표현식이 하나 이상 모인 것. 표현식 마지막에 ;이 찍힌 것 키워드 특별한 의미가 부여된 단어 - break - case - catch - continue - debugger* - default - delete - do - else - finally - for - function - if - in - instanceof - new - return - switch - this - throw - try - typeof - var - void - while - with 식별자 변수와 함수 이름 등 이름을 붙일 때 사용하는 단어 약속 클래스의 이름 첫 글자는 대문자로 시작한다. 변수,..
-
JavaScript 시작하기 - 실습 세팅(환경) 설정, node.js 설치, 간단 출력 예제웹/JavaScript 2022. 8. 29. 15:10
이번엔 JavaScript를 시작해보려고 합니다. JavaScript란? 객체 기반의 스크립트 프로그래밍 언어이다. 이 언어는 웹 브라우저 내에서 주로 사용되어 활용성이 높다. 다른 응용 프로그램의 내장 객체에도 접근할 수 있는 기능을 가지고 있다. Node.js와 같은 런타임 환경과 같이 서버 프로그래밍에도 사용되고 있다. 실습환경 구축 Visual Studio Code 설치하기 Node.js 설치하기 (짝수버전 추천) + ) 추가로 크롬 설치하기 출력 예제 1. Visual Studio Code 를 실행 후 js 파일을 생성합니다. 2. console.log('Hello'); 를 작성해줍니다. 3. powershell 또는 cmd를 실행합니다. 4. js가 저장된 폴더를 열고 공백에 shift+마우스..
-
CSS의 형식 - HTML의 스타일과 스타일 시트 (HTML 꾸미기)웹/CSS 2022. 8. 29. 13:59
이번엔 HTML 문서를 꾸미는 방법에 대해 알아보려고 합니다. CSS를 사용하는 이유, 목적 웹의 스타일(글꼴, 색상, 정렬 등)을 결정하기 위해 CSS를 사용합니다. 웹 문서의 내용과 상관없이 디자인을 설정할 수 있습니다. 기기에 맞게 탄력적으로 문서를 만들 수 있습니다. CSS의 형식 태그 후 선택자와 중괄호({}) 안에 스타일 속성과 속성값을 적어줍니다. 주석은 /* */를 사용합니다. 스타일 규칙은 세미콜론(;)으로 구분합니다. 가시성을 위해 여러 줄에 작성하는 경우가 많습니다. 외부 스타일 시트 스타일 규칙이 많을 경우 또는 같은 규칙을 여러번 사용할 경우 사용합니다. css 규칙들을 하나의 파일에 작성한 후 확장자를 css로 저장합니다. html의 태그 안에 문구를 추가합니다. 선택자 전체 선..
-
HTML의 구성요소 - tag(태그)와 attribute(속성)웹/HTML 2022. 8. 28. 17:58
이번엔 HTML의 태그와 속성에 대해 알아보고자 합니다. HTML 요소 태그 명령어의 종류를 뜻합니다. 시작태그와 종료태그로 이루어진 모든 명령어를 말합니다. HTML 태그 요소의 하나로 시작태그와 종료태그로 이루어져 있습니다. 주요 태그는 아래와 같습니다. 텍스트 관련 태그 : 두껍게(bold) 효과를 준다. : 텍스트를 기울임꼴(italic)로 표시한다. : 포함된 텍스트를 강하게 강조할 때 사용한다. : 보다 약한 강조를 나타낼 때 사용한다. 목록 관련 태그 : 순서 없는 목록(unordered list)을 표시한다. : 목록에서 각 항목(list item)은 와 사이에 넣는다. : 순서 있는 목록(ordered list)을 표시한다. 링크,이미지 관련 태그 : 하이퍼링크를 생성하는 태그이다 : 페..
-
HTML 구조웹/HTML 2022. 8. 28. 17:39
HTML의 구조는 head와 body로 구성되어 있습니다. 기본 구조 HTML의 문서 초입부에 를 적고 로 시작됩니다. 태그가 시작되었으면 태그가 끝나는 부분에 을 적어야 합니다. 사이 와 태그가 들어갑니다. 대문자, 소문자 모두 상관 없지만 가시성을 위해 편의상 소문자를 주로 사용합니다. 웹 브라우저가 알아야 하는 정보를 적어줍니다. 같은 페이지나, CSS의 링크를 적어줍니다. 파비콘(favicon), 그리고 다른 메타데이터(작성자, 중요한 키워드와 같은 HTML에 대한 내용)를 포함합니다. 화면에 출력되야 하는 정보를 적어줍니다. 주요 정보를 사용자에게 알기 쉽게 여러 태그를 이용합니다. 로 구역을 나누거나 을 사용하는 경우가 많습니다.