개발자 9Diin의 개발일기

본 포스팅은 '러닝 타입스크립트' 도서를 전적으로 참고하여 작성하였습니다. 1️⃣ 타입의 종류 타입스크립트에서의 타입은 자바스크립트에서 다루는 값의 형태에 대한 설명이다. 우리가 흔히 알고 있는 자바스크립트의 자료형과 비슷하다고 이해하면 좋다. 여기서 '형태'란 값에 존재하는 속성과 메서드 그리고 내장되어 있는 typeof 연산자가 설명하는 것을 의미한다. 타입스크립트의 가장 기본적인 타입은 자바스크립트의 일곱 가지 기본 원시 타입 (Primitive Type)과 동일하다. 타입스크립트의 Type null undefined boolean string number bigint symbol 2️⃣ 타입 시스템 타입 시스템은 프로그래밍 언어가 프로그램에서 가질 수 있는 타입을 이해하는 방법에 대한 규칙 집합이..

본 포스팅은 '러닝 타입스크립트' 도서를 전적으로 참고하여 작성하였습니다. 1️⃣ TypeScript란 무엇인가? TypeScript는 마이크로소프트 회사에서 구현한 JavaScript 슈퍼셋(Superset) 프로그래밍 언어이다. 확장자로는. ts를 사용하며 컴파일의 결과물로 JavaScript 코드를 출력한다. 최종적으로 런타임에서는 이렇게 출력된 JavaScript 코드를 구동시키게 된다. 위 설명은 어디까지나 정의에 가깝고 쉽게 풀어 설명해 보자면 타입이라는 것이 지정되어있지 않은 자바스크립트에 타입(Type)이라는 것을 설정하여 정적 타입을 명시할 수 있도록 한 것이 순수 자바스크립트와의 가장 큰 차이점이라고 할 수 있다. 보통 자바스크립트를 Dynamic Language라고 부르는데 자유도가 ..

https://sungjaecloud.tistory.com/380 Vue.js로 CRUD 구현하기 - 1강 안녕하세요, 구디사는 개발자 '9Diin' 입니다. 오늘부터 Vue.js 자바스크립트 프레임워크를 사용하여 흔히 '투두리스트'라고 불리는 웹 서비스를 한 번 만들어 볼 텐데요. 이전 콘텐츠였던 Open Weather sungjaecloud.tistory.com 안녕하세요, 구디사는 개발자 '9Diin' 입니다. 먼저, 제 강의에 관심을 가져주신 구독자 여러분께 진심으로 감사하단 말씀 드립니다. 1강 - 프롤로그 영상에서 영상으로 보셨던 내용 중 일부는 위 게시물에서 발췌한 부분이 있기 때문에 위 게시물을 보시는 것도 추천드립니다. 다시 한 번 감사드린다는 말씀 드리면서 프롤로그 강의 자료는 아래 첨..

첫 프로젝트 진행이 마무리 단계에 접어들면서, 8월이 밝았다. 그러나 모든 개발이 그렇듯 예상치 못한 이슈가 생겼다. 다행히(?) 크리티컬 한 이슈는 아니었지만, 이번 이슈로 인해 몇 가지 경우의 수가 발생할 수 있음을 깨달을 수 있었던 좋은 계기가 되었다. 그래서 이번 시간엔 해결했던 이슈를 기록해보고자 했다. 1️⃣ Issue - 월초에 데이터 리셋이 될 경우 - 빈 데이터가 넘어오기 때문에 화면에 데이터 조회가 되지 않는다. 나는 자바스크립트 reduce라는 메서드를 사용하여 배열의 각 요소의 합을 구하는 로직을 짠 적이 있다. Vue.js의 계산된 속성 / 계산된 데이터를 만들어 내는 computed 속성에 total이라는 데이터를 새로 만들었는데 그 리턴 값을 reduce를 통해 구현한 것이다...

안녕하세요. 구디사는 개발자 9Diin(구디인)이라는 닉네임으로 웹 프로그래밍 강의 콘텐츠를 다루고 있는 초보 유튜버입니다. 이번 포스팅은 제가 거의 반년 동안 강의 콘텐츠를 준비하면서 무얼 얻었고, 무엇이 바뀌었는지 회고를 작성하는 시간을 가져보고자 합니다. 사실 경력이라고 하기에도 창피한 초보 개발자라서 누군가를 가르친다는 게 말도 안 된다고 생각을 하고 있는 터라 어디까지나 내 개인적인 성장을 위해, 스스로 공부한 것들을 기록하는 것에 중점을 두고자 시작했던 콘텐츠였기에 구독자나 조회수에 연연하지 않았는데 그래도 200명이 넘는 분들이 내 채널을 구독해주시고, 댓글도 달아주시고, 메일로 여러 문의까지 오는 걸 보고 사뭇 많은 것을 느꼈는데요. 그래서 서두에 말했던 것처럼 감사한 마음과 다시 한번 더..

https://sungjaecloud.tistory.com/355 자바스크립트 콜백 함수란 무엇인가? https://www.daleseo.com/js-async-callback/ [자바스크립트] 비동기 처리 1부 - Callback Engineering Blog by Dale Seo www.daleseo.com Callback함수란?? 뭔데?? 아 진짜 짜증났다...넌 힘내라!! 커몬~~ velog... sungjaecloud.tistory.com 비동기 처리 Promise를 알아보기 전에 ES6에서 Promise가 도입되어 널리 사용되기 전의 문제점을 한 번 살펴보고 갈 필요가 있다고 생각한다. 콜백 함수를 통한 비동기 처리의 문제점은 무엇이 있을까? findUserAndCallBack(1, funct..

6월 말부터 지금까지 새로운 직장에서 각자 실력이 월등한 팀원들과 함께 서비스를 준비하고 있는데요. 개발이란 직군이 매 순간 어려움에 부딪힐 수밖에 없지만, 그래도 너무 친절한 동료 덕에 잘 헤쳐나가고 있습니다. 아무튼, 오늘의 개발 포스팅은 나름 Vue.js를 공부했다고 자부했지만, 기본기도 없었던 저였음을 새삼 실감했던 시간인데요. 바로 Vue.js 내장 컴포넌트(Built-In Component) 때문이었습니다. 오늘은 그중 component라는 내장 컴포넌트를 알아보고자 해요. 😎 내장 컴포넌트 Built-In Components Vue.js에서 기본적으로 제공하는 내장 컴포넌트는 동적 컴포넌트를 렌더링 하기 위한 '메타 컴포넌트'라고 공식문서에서 말하더라고요. 하지만 이게 정확히 무슨 뜻인지 알..

https://youtu.be/XwMBu6yrlUo 📌 Reusability & Composition 이번 포스팅은 'Vue.js 프로젝트 투입 일주일 전' 도서를 참고했습니다. ✅ Composition API 컴포지션 API는 컴포넌트 내에서 사용하는 특정 기능을 갖는 코드를 유연하게 구성하여 사용할 수 있도록 Vue3 버전에 추가된 함수 기반의 API이다. 컴포넌트 API가 생긴 이유는 Vue는 프로젝트 규모가 커질수록 관리하기 힘들다. 는 단점이 있어서 컴포넌트의 계층구조가 복잡할수록 코드에 대한 추적 및 관리가 어려웠다고 한다. 그래서 생겼다고 한다. 그래서 컴포지션 API를 이용하면, setup( )이라는 메서드 안에서 한 덩어리로 코드를 구현할 수 있기에 코드에 대한 관리가 훨씬 쉬워진다고 한..