코딩각

자바스크립트 화살표 함수(Arrow Function) 사용법

자바스크립트에서 화살표 함수를 처음 보면 저게 무엇인가 하고 혼동스러운 시간이 있습니다. 그런데 기호라는 것이 그렇듯이 시간이 지나고 익숙해 지면 가독성이 더 좋아지는 효과가 있습니다. 그러기 까지 어느 정도 시간이 걸리겠지만 숙련자가 되기 위한 과정입니다. HTML 페이지를 하나 만들어 놓고 DOM으로 자바스크립트 화살표 함수에 대해 알아보겠습니다. arrow function ex 기본함수에서 화살표함수, 그리고 축약형 문법은 아래와 같습니다. 첫번째는 function 키워드를 사용했으니 알아보기 쉽습니다. 두번째는 function 키워드가 없어지고 => 가 뒤에 붙는 것으로 바뀌었습니다. () 괄호안은 매개변수입니다. 마지막 축약형은 return 문을 => 화살표 함수표시의 뒤에 둠으로써 완성됩니다...
코딩(CODING)/자바스크립트(JS) 2022. 6. 24. 12:03

자바스크립트 돔(DOM) 조작하기 - HTML/CSS/JS

웹개발을 본격적으로 학습하다가 막히는 부분이 몇개 있는데 그 중에 하나가 DOM 입니다. DOM은 Document Object Model - 문서 객체 모델의 약자로 쉽게 말하면 웹브라우저에서 HTML의 요소들을 클라이언트에서 이 DOM을 사용해 동적으로 조작하는 것 입니다. (DOM은 돔이라 부른다) 왜 이걸 사용하느냐? 웹의 초기로 거슬러 올라가 보면 이해가 쉽습니다. 인터넷 초기에 웹브라우저는 서버에 저장된 정적인 페이지, 혹은 서버에서 DB를 처리하여 동적으로 만든 웹페이지를 주로 전송받아서 표시하는 역할을 했습니다. 그 방법으로도 웹이 돌아가지만 그러면 클라이언트(PC나 스마트폰)는 놀고 있는 것이나 마찬가지 입니다. 페이지 하나를 바꾸려면 전체 페이지를 다시 로드해야 하고 서버의 응답시간은 늘..
코딩(CODING)/자바스크립트(JS) 2022. 6. 23. 18:25

패키지와 모듈, 패키지 만들기 - npm 튜토리얼 2

npm에 대해서 이해하려면 우선 public npm registry 가 뭔지 알아야 합니다. npm docs의 설명은 다음과 같습니다. The public npm registry is a database of JavaScript packages, each comprised of software and metadata. Open source developers and developers at companies use the npm registry to contribute packages to the entire community or members of their organizations, and download packages to use in their own projects. the public np..
코딩(CODING)/자바스크립트(JS) 2022. 6. 17. 14:54

npm 가입하기 - npm 튜토리얼 1

npm은 node package manager의 약자입니다. 다양한 노드 패키지와 자바스크립트 프레임워크를 사용할 수 있는 패키지 매니저인데요. 다른 개발자들이 만든 것들을 많이 사용하다보면 스스로 패키지 매니저를 만들어 보고 싶다는 생각도 하게되는데요. 아주 좋은 오픈소스의 정신입니다. 이 포스팅에서는 npm 가입하는 것 부터 알아보겠습니다. 다음 사이트에서 npm 계정을 만들도록 합니다. npm (npmjs.com) npm Bring the best of open source to you, your team, and your company Relied upon by more than 11 million developers worldwide, npm is committed to making JavaSc..
코딩(CODING)/자바스크립트(JS) 2022. 6. 16. 22:31

자바스크립트 기본 to do list

to do list 프론트엔드를 배우면서 처음에 많이 만드는게 to do list 입니다. C나 자바 같은 전통 프로그래밍 언어는 항상 시작할 때 Hello World 를 출력하고 시작하는데 이게 쓸모없는게 아니라 런타임에서 작동하는 코드를 구현해봄으로써 언어의 대략적 구조나 원리를 이해할 수 있기 때문입니다. 시작점이라고 하지요. 그런데 자바스크립트 같은 동적타입언어는 소스코드에서는 많은 것을 숨기고 컴파일러가 자동으로 추론(infer)하는 처리가 많기 때문에 Hello World를 해봤자 별로 알수 있는게 없습니다. 이 언어는 문법이 간단한가? - 정도로 생각할 뿐입니다. to do list는 웹프레임워크의 Hello World 같은 프로그램입니다. 웹프레임워크는 마지막에는 브라우저안에서 html c..
코딩(CODING)/자바스크립트(JS) 2022. 4. 2. 22:00
◀ 1 2 3 4 ▶

티스토리툴바