안녕하세요, dawonny 입니다!오늘은 브렌트 래스터의 [러닝 깃허브 액션]이라는 책에 대한 리뷰를 작성해보려고 합니다.깃허브 액션에 대해 깊이 있는 공부를 하고 싶어 하시는 분들께 아주 유용한 책이 될 것 같아 소개해드릴게요.🔖 흥미를 끌었던 이유사실 이전에 깃허브 액션에 대해서 자세히 공부하고 개념을 알아본 적은 없었어요.하지만 최근에 제 포스팅을 보신 분들은 아시겠지만 개발 블로그의 글을 정해진 시간마다 확인하고, 깃허브 프로필(README) 파일에 자동으로 반영되게 하려고 깃허브 액션 기능을 경험해보면서 흥미가 생겼습니다.자동화 작업을 하다 보면 깃허브 액션처럼 유용한 도구가 정말 많다는 걸 느꼈거든요. 우리가 작업할 때 자동화가 중요한 만큼, 더 알아보고 싶다는 생각이 들었어요.🔖 책의 내..
안녕하세요, dawonny 입니다. 저는 현재 졸업유예생 신분이기도하고, 주변에 휴학생 친구들이 많은편인데요.그래서 이 참에 정보처리기사 자격증 취득에 도전해보기로했습니다! 얼마전에 필기시험을 응시하고 왔고, 합격 점수를 다행히 넘겨서 곧 실기시험 준비를 해야할 것 같습니다.직접 시험을 한번 보니까 어떤 식으로 준비하면 좋을지 알겠더라구요! 그래서 이렇게 리뷰를 작성해봅니다.필기 전형 응시 계획있으신 분들께 도움이 되었으면 좋겠네요. 참고들어가기에 앞서, 저는 시험 응시날 3주 전쯤에 문제집을 구입했고 대략 2주정도 시간 내서 조금씩 다 풀었어요!마지막 4, 5 과목은 시험 얼마 안남았을 때 (2-3일) 조금 급하게 풀었구요. 특히 5과목은 전날에야 다 정리하고 갈 수 있었습니다.그래서인지 점수는 1,2..
오픈소스 기여를 한번도 해본 경험이 없는데 번역하는 것으로 시작해보고 싶어졌다.무엇을 할까 고민하다가 평소에 자주 들어가는 MDN Web Docs 를 목표로 잡았다.파파고와 GPT 그리고 구글링과 함께라면 번역은 두렵지 않으니까..!당장 도전! 참고) 기초적인 Git 을 다룰 줄 안다는 가정하에 작성했다.방법일단 두 개의 레포지터리를 다룰 것이다.https://github.com/mdn/translated-content https://github.com/mdn/content 1. 두 개의 레포지터리를 fork 해온다. Fork 버튼을 누르면 된다. 2. [본인 깃허브 ID]/translated-content 레포지터리와 [본인 깃허브 ID]/content 레포지터리를 둘 다 로컬에 clone 한다.초록..
블로그에 글을 쓰면 자동으로 커밋되는 걸 설정해보고 싶어서 도전하는 포스팅!이러면 좀 더 쓰고 싶은 마음이 들지 않을까 하는.. ;) 사실 원래 쓰던 tistory-readme-stats 서비스 가 있었는데 이제 티스토리에서 open api 서비스를 종료해서 사라져버렸다.아무튼 GitAction 을 활용하는 방법이 있길래 이걸로 해볼까 한다. 차근차근 해보자! RSS 설정먼저 티스토리 블로그 관리 > 블로그로 들어간다 위 처럼 설정해주고 변경사항을 저장한다그리고 [본인 블로그 주소]/rss 주소로 접속해서 잘 나오는지 한번 확인해보기ex: https://dawonny.tistory.com/rss GitAction최신 글 목록 5개를 보여주는 부분을 README에 추가하려고 한다.깃허브에 처음 들어가면 보..
안녕하세요 dawonny 입니다.오늘 리뷰 할 도서는 [개발자를 위한 커리어 관리 핸드북(마이클 롭 지음)] 입니다. 개발자로서의 커리어를 쌓다 보면 개발 자체보다 더 다양한 문제에 직면할 수 있습니다. 직장 내 인간관계부터 이직 방법까지 정말 다양하죠. 이 책을 읽으면서 느낀 점은, 제가 생각했던 것보다 커리어 관리는 훨씬 더 넓은 범위를 포함한다는 것입니다.저자는 46가지의 이야기를 통해 넷스케이프, 볼랜드, 슬랙, 핀터레스트, 애플 등 실리콘 밸리의 유명 회사들에서 얻은 경험과 노하우를 풀어냅니다. 딱딱하지 않고 친근한 문체와 대화 예제들이 포함되어 있어 읽기에 편하고 좋았습니다.인상깊었던 부분📖 p.36좋은 방법이 있습니다. 관리자는 여러분의 직무에 대한 책임을 지고, 여러분은 스스로의 커리어를..
안녕하세요, dawonny 입니다. 오랜만에 데보션의 테크세미나를 신청해서 듣게되었는데요. 데보션영으로서 미션을 수행했던 작년이 생각나서 즐거웠네요!이번 테크세미나는 '기술 블로그'를 주제로, 글또 커뮤니티 운영자이신 변성윤님이 세미나 스피커로 참여해주셨습니다.세미나의 제목은 [실용주의 기술 블로그 글쓰기] 였어요.세미나를 듣게 된 계기는사실 이번 세미나를 듣게 된 가장 큰 이유는 제 고민을 해결할 수 있을까하는 기대 때문이었어요.그리고 그 고민은 기술 블로그의 방향성에 대한것이었습니다. 처음에 티스토리 블로그를 시작한 목적은 수강한 강의를 정리하는 것이었어요. 하지만 시간이 지나면서 추가로 궁금한 것들을 정리하거나 트러블슈팅을 기록하는 용도로도 사용하게 되었죠. 그러다 보니 방문자 수가 늘어나면서 어..
안녕하세요. dawonny 입니다. 오늘 리뷰할 도서는 [읽기 쉬운 코드(마크 시먼 지음)] 입니다. 1.코드를 작성해서 프로그램이 동작하게 하는 것. 이렇게 단순히 프로그램이 ‘실행’이 되게 하는 것도 개발자로서 중요한 임무이고 가장 기본이 되는 것이지만, 더 나아가서 고려해볼 것이 있다면 무엇 일까요? 개발에 대해 잘 모르는 분야에 있는 사람있는 사람이라면 서비스 자체가 잘 실행되는 것이 더 중요할 수 있겠지 만요. 코드를 깔끔하게 짜는 것, 다양한 패턴을 적용하고 구조를 잘 설계하는 것… 등등 모두 답이 될 수 있을 것 같습니다.하지만 저는 이 책을 읽고 이 모든 것이 결국에는 이 목표를 향해야 하겠구나-라는 생각이 들었어요. 바로 사람이 읽기 쉬운 코드를 짜야한다는 것입니다. 2.개인 프로젝트가..
안녕하세요 dawonny 입니다.오늘 리뷰 할 도서는 [실전 스벨트 & 스벨트킷 입문] 입니다. 저는 웹 프론트엔드 분야 공부를 하며, 주로 리액트라는 라이브러리를 학습하고 있는데요.하지만 이번 도서를 좋은 기회로 제공받아 스벨트에 대해서 처음 접해보게 되었습니다! 아무래도 당장 대중적으로 쓰이고 취업시장에서 수요가 많은 것은 리액트이겠지만, 자바스크립트 현황 2022 보고서를 보면 꾸준히 스벨트의 인기도가 우상향하고 있는 것을 알 수 있어요.그만큼 계속 사람들이 관심을 가지고 있는 스벨트에 대해서 저 또한 흥미가 생겼는데요. 무엇보다 저는 동일한 기능을 구현하는 스벨트 코드와 리액트 코드를 비교한 것을 보면서, 스벨트가 정말 궁금해졌어요. 스벨트의 구문이나 템플릿 언어 자체가 쉽게 느껴졌거든요. ..
요즘 프로젝트를 개발하면서 api 호출하는 부분에 대해서 최적화할 수 있는 부분이 있다면 조금씩 리팩토링해보는 중이다.그 중에서도 똑같은 내용으로 api 를 호출했을 때, 다시 응답을 새롭게 기다려야하는 부분을 개선해보고 싶었다. 캐싱 이란?캐싱이란 어떤 데이터를 한번 응답으로 받으면, 임시로 데이터를 다른 곳에 저장해서 필요시에 더 빠르게 불러와서 사용할 수 있는 프로세스를 말한다. 즉, 똑같은 요청을 또 하는 불필요한 요청을 줄일 수 있다. 캐싱을 어디에하지?localStorage, sessionStorage 등 다양한 곳에 저장할 수 있다.나는 브라우저가 닫히면 캐시 데이터 또한 깔끔하게 삭제되길 원했기에 sessionStorage에 저장하는 방법을 택했다. * 영구적으로 저장하고 싶으면 local..
안녕하세요 dawonny 입니다. 오늘 리뷰 할 도서는 입니다. 마침 면접을 준비해야하는 상황에 놓인 저의 막막함을 조금이나마 달래준, 그리고 앞으로의 지원에도 방향성을 알려준 고마운 책이었어요.이 책에서는 현직 카카오 면접관이 IT 기업 취업과 이직 전략을 상세하게 다룹니다. 면접관의 입장에서 지원자에게 바라는 모든 내용들, 예를들어 기본CS지식, 포트폴리오, 코딩테스트, 면접 팁 등 정말 알차게 담겨있어요.그 중에서 개인적으로 기억에 남는 내용은 다음과 같아요. 📖 p.50 신입을 뽑을 때 중요하게 보는 것회사 규모가 클 수록 신입사원 공채 때 특정 언어 구사 능력을 보는 경우는 드물다. 특정 언어를 구사하면 우대 사항은 있을지라도 그보다는 개발에 흥미가 높아서 빠르게 배울 수 있는지, CS 전..
안녕하세요 :)dawonny 입니다. 오늘 리뷰할 책은 [클라우드 네이티브 스프링 인 액션(토마스 비탈레 지음)] 입니다! 저는 현재 프론트엔드를 공부하고 있어서 확실히 클라우드나 스프링에 관한 내용을 많이 접할 일은 상대적으로 적었는데요. 이번에 좋은 기회로 책을 읽어보게 되어서 이 참에 클라우드에 대해서 관심을 가져보는 경험을 해보자! 싶었습니다. 책의 첫 목차를 보았는데 그동안 몰랐던 점과 부족했던 지식을 채울 수 있을 거란 기대감이 들었습니다. 책의 구성은 16개의 목차가 4개의 파트로 나누어져 있었고 책을 읽기 전 가장 기대했던 파트는 첫 번째 파트입니다. 첫 번째 파트는 클라우드 네이티브에 대한 설명이 있었는데 그동안 주워들었던 개념들을 정리할 수 있는 점이 좋았습니다. 또한, 클라우드 환경..
오랜만에 깃허브 리드미 꾸미기를 하다가 기술스택 부분을 작성해보고져서 서치를 하던 중 괜찮은 것을 발견해서 공유합니다! 결과물은 위와 같아요. 8가지 정도 추가해봤는데, 예쁜 것 같아요. 위 이미지처럼 기술 스택을 뱃지형태로 만드는 방법이 제일 많이 쓰는 방법인 것 같은데요. 저는 이것 말고, 좀 더 둥글둥글하고 로고가 더 돋보이는 디자인을 원했어요! 마침 편리하게 추가할 수 있는 기능을 제공하는, 레포지터리를 찾을 수 있었는데요. 바로 skill-icons 입니다. 사용법 사용법은 간단합니다. [](https://skillicons.dev) 위 코드를 Github README 에 복붙하기만 하면..
프로젝트에서 메뉴 기능을 개발하면서 useRef 기능을 이 참에 잘 이해하고 써보려고 했다. 햄버거 모양의 메뉴 버튼을 클릭하면 → 메뉴가 펼쳐진다 햄버거 모양의 메뉴 버튼을 다시 클릭하면 → 메뉴가 닫힌다 펼쳐진 메뉴를 제외한 화면의 다른 부분을 클릭하면 → 메뉴가 닫힌다 👉 이걸 구현하고자 함!! useState, useRef, useEffect 훅을 사용해서 메뉴의 열림/닫힘/메뉴 바깥 영역 클릭시 메뉴 닫힘 기능을 구현해보자. const [isMenuOpen, setIsMenuOpen] = useState(false); const menuRef = useRef(); // 드롭다운 메뉴에 대한 참조 먼저 useState 훅을 사용해서 메뉴의 열림/닫힘 상태를 나타내는 isMenuOpen 이라는 상..
TailwindCSS 에 폰트 적용하는 법을 정리해보려한다! 이전에 했었는데 생각이 안나서 다시 찾아봤다. 나중에 또 안 찾아보도록 ... 폰드 다운로드와 저장 https://fonts.google.com/ Browse Fonts - Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com 우선 위 사이트에서 폰트를 다운받는다 폰트 ttf 파일을 프로젝트에 넣어둔다. 나는 src > assets 폴더에 fonts 라는 폴더를 하나 만들어서 여기에 ttf 파일을 저장했다. font-face @font-face { font-family: "Roboto"; src: url("../src/..
안녕하세요! 이번에 읽은 도서는 제가 평소에 접하던 웹, 프론트엔드 분야와 조금 다른 AI에 관련된 도서였어요. 도서의 제목은 [멀티모달 생성 AI 인사이드] 입니다. 저는 평소에 개발을 할 때, 개인 작업을 할 때에도 GPT4를 정말 잘 사용하고 있는데요! 유료 버전을 구독하고 사용하고 있을만큼, 이제 GPT4가 없던 때로는 돌아가지 못할 것 같습니다. 제일 유명한 모델이 흔히들 아시는 GPT 이지만 저는 이 책을 통해서 다른 모델들도 어떤 다양한 특징이 있는지 알 수 있었어요. 멀티모달 생성 AI 의 기초적인 개념부터,어떻게 활용하면 좋을지,그리고 미래에는 어떨지 전망까지 다루고 있어서 생성 AI 에 관심이 있으신 분들이라면 흥미롭게 읽어볼 구석이 많을 것 같았습니다. 또한 적절히 멀티생성 AI에 ..
keyof keyof 키워드는 object 타입의 모든 key 를 가져와서 유니온 타입으로 반환한다. 아래의 예시를 보자 interface Person { age: number; name: string; } type PersonKeys = keyof Person; // "age" | "name" 위에서 PersonKeys 타입은 age와 name 중 하나의 문자열 값만 가질 수 있는 리터럴 타입이다. Mapped Types Mapped Types 를 이용하면, 기존의 타입을 새로운 타입으로 변환할 수 있다. object 의 각 속성에 대해 반복적으로 적용을 할 수 있어서 타입 변환 과정을 간결하게 만들어 준다. type TypeChanger = { [Key in keyof MyType]: NewType;..
interface와 implements 를 사용한 class 타입 확인 interface 는 object 의 타입을 지정할 때 사용할 수 있다. 그리고 또 다른 용도로, class 의 타입을 확인할 때에도 사용할 수 있다. 이 때, implements 키워드도 필요하다. 아래의 예시를 보자. class Car { model: string; price: number = 1000; constructor(a: string) { this.model = a; } } let 붕붕이 = new Car('morning'); 위의 Car 클래스에서 생성된 객체들은 model 과 price 속성을 가진다. 클래스가 특정 속성을 가지고 있는지 타입으로 확인하고 싶을 때, interface 와 implements 키워드를 사..
개념 d.ts 파일은 TS에서 타입 정의를 저장하는 파일이다. 여기서 'd' 는 Definition 의 약자이다. 이 파일들은 TS 컴파일 과정에서 JS로 변환되지 않으며, 타입 정보만 포함한다. 주로 2가지 용도로 사용된다. 1. 타입 정의 저장 : 타입 정보만을 분리하여 저장하고, 필요한 곳에서 import 해서 사용한다 2. 레퍼런스 용 : 프로젝트에서 사용하는 타입을 정리해놓은 문서로 활용할 수 있다. d.ts 파일에서 타입 정의하기 d.ts 파일 내에서는 주로 type 키워드, interface, 함수 타입 정의를 포함할 수 있다. 함수 본문을 정의할 수는 없고, 파라미터과 return 타입만 지정할 수 있다. export type Age = number; export type Multiply ..
안녕하세요오늘 리뷰할 도서는 [모던 리액트 Deep Dive] 입니다. 제가 웹 프론트엔드 학습을 하면서 가장 주요하게 공부하고 있는 라이브러리가 React 인 만큼, 정말 읽어보고 싶었던 책인데요.이 책에서는 React 개발자로써 알아두어야 할 내용을 정말 다양하게 다루고 있어요.책에서 다루는 내용을 나열해보자면 다음과 같습니다. -리액트에서 자주 쓰는 자바스크립트-함수, 클래스, 클로저, 이벤트 루프, 비동기 통신,-리액트 코드를 효과적으로 작성하기 위한 타입스크립트 활용법-JSX, 가상 DOM과 리액트 파이버-함수/클래스 컴포넌트, 렌더링-메모이제이션, 리액트훅-서버 사이드 렌더링, Next.js 톺아보기-상태관리, 디버깅하기 위한 리액트 개발 도구-좋은 리액트 코드 작성을 위한 환경 구축, 리액트..
JS 파일에 선언된 변수 TS 파일에서 사용하기 JS 파일에서 선언된 변수를 TS 파일에서 사용하고 싶을 때에는 declare 키워드를 사용한다. declare 키워드를 사용하면 TS 파일 내에서 JS 파일에 정의된 변수나 함수의 타입을 명시할 수 있다. declare let a: number; 위 예시처럼 TS 파일에 declare 를 선언하면 '변수 a 는 number 타입이며, 이미 어딘가에 정의되어 있다' 라고 TS 컴파일러에게 알리는 것이다. declare global 'declare global' 은 TS 모듈 내에서 전역 변수나 타입을 선언할 때 사용된다. 일반적으로 TS 파일은 자체 scope 를 가지고 있어, 파일 내에서 선언된 변수나 타입은 그 파일 내에서만 접근이 가능하다. 하지만 때..
Tuple type Tuple 은 타입스크립트에서 고정된 수의 요소를 가지면서, 각 요소의 타입이 명시적으로 지정된 배열의 타입이다. 각 요소의 타입은 다를 수 있고, 배열의 길이는 고정된다. 예를 들어 첫번째 요소가 문자열이고, 두번째 요소가 숫자인 배열을 정의하고 싶다면 다음과 같이 작성할 수 있다. let exampleTuple: [string, number] = ['hello', 42]; Tuple 응용 : Rest Parameters 함수의 매개변수로 '...' (rest 연산자)를 사용하면 인자를 배열로 받을 수 있다. 이 기능을 tuple 이랑 결합해보자. 예를 들어 첫번째 인자는 문자열이고, 두번째 인자는 숫자여야 하는 경우에 다음과 같이 작성할 수 있다. args 라는 배열에 string..
README를 작성하다보면 Architecture 소개 부분에 아래와 같이 폴더 구조도를 넣고싶은 경우가 있다. 구글링 해보니까 쉽게 할 수 있는 VSCode 확장 프로그램이 있길래 소개한다. VSCode Extension 에서 file-tree-generator 를 설치한다 원하는 폴더에서 오른쪽 클릭을 하고 [Generate to Tree] 를 클릭한다 그럼 이렇게 프로젝트 구조도가 보기좋게 만들어져서 나온다. 아이콘은 [icon on] [icon off] 버튼을 통해서 만들수도, 지울수도 있다. 내용을 복사해서 README 작성 란에 추가할 때 위 아래에 백틱을 3개씩 추가하면 완성! ``` (복사한 내용 붙여넣기) ``` 자주 쓸 것 같다!
안녕하세요 dawonny입니다. 이번에 읽어본 도서의 제목은 [프로덕트 매니지먼트의 기술(맷 르메이 지음)]입니다 저는 프로젝트 개발 과정에서 팀원들과 소통하며, PM 역할을 수행하는 팀원과의 협업 경험도 자주 있었는데요. 협업 과정 중에 저는 프로덕트 매니저(PM) 직무에 대해 정말 존경스러워졌고 또한 매력을 느끼게 했습니다. 이 책은 프로덕트 매니저가 프로덕트의 성공을 위해 나아가야 할 방향과 현실적인 문제들을 솔직하게 다룹니다. 특히, 개발자, 디자이너, 임원, 사용자와의 효율적인 소통 방법에 대한 내용은 매우 흥미롭게 다가왔어요. 정말 ‘모두와’ ‘잘’ 소통할 수 있는 사람이어야 되겠구나 싶더라구요. 저자는 다양한 문제 상황을 시나리오로 보여주면서, 이런 문제상황들을 해결하기 위한 실질적인 조언을..
안녕하세요, dawonny입니다.이번에 읽어본 책은 [개발자 오늘도 마음 튼튼하게 성장하기(피오다르 서재나베츠 지음)] 입니다. 다른 개발자 관련 서적들과는 제목과 표지의 분위기가 달라서 그런지 첫인상이 귀여웠어요. 이 책은 개발자들을 위한 자기계발서 같았습니다!저는 사실 ‘어떻게 살아야한다.’, ‘성공하는 방식은 이렇다’ -와 같이 말하는 책들은 비판적으로 읽고 부담스러워서 거리를 두게 되는데요.이 책에서는 개발자들이 본인들의 생산성을 어떻게 높일 수 있는지, 이를 높이기 위해서 어떤 구체적인 방법을 적용해야하는지,이 방법에 대한 과학적인 근거는 무엇인지에 대해서 자세하게 설명해줍니다. 그래서 굉장히 흥미롭게 읽었어요. 되새기고 싶은 문장에는 인덱스를 붙이고 표시도 해가면서 읽었는데, 덕분에 자기반성을..
안녕하세요. dawonny 입니다. 얼마전 카이스트에서 열리는 SPARCS 2024 해커톤에 다녀왔습니다!전국에서 80명, 총 20팀이 참여하게 되는 해커톤이었는데요.저는 PM / 디자인 / iOS / 서버 개발이 다 되는... 다재다능한 친구에게 같이 나가자고 졸라서 2인으로 참여하게 되었어요!(개인 또는 2인 팀 신청이 가능했습니다) 밖에서 일정이 끝나고 카페에 가서 부랴부랴 지원서를 쓰고 제출했는데 합격했더라구요!지원서는 아래과 같이 작성했습니다.[지원 동기]저는 컴퓨터공학부에 입학한 후 처음엔 개발자는 혼자 공부하고 일하는 직업이라고 생각했습니다. 하지만 컴퓨터공학부 학회장이나 구글 학생 개발자 동아리 운영진 활동 등을 하면서 개발자에게 필요한 것은 소통과 협업이며, 단순히 프로그램을 구현하는 것..
문제 Vite로 생성한 React 프로젝트를 개발하는 과정에서 나는 react-router-dom 라이브러리를 활용해서 라우팅을 진행했다. import { Route, Routes } from "react-router-dom"; import TreeBranchView from "./pages/TreeBranchView"; import MemberBranchView from "./pages/MemberBranchView"; function App() { return ( ); } export default App; 코드를 모두 작성하고 Vercel 로 배포한 후 배포된 주소로 접속하는데 분명 로컬에서는 잘 라우팅 되어 접속되었던 주소가, Vercel로 배포한 주소로 들어갔을 때에는 404: NOT_FOUNT..
Vite 으로 생성한 React 프로젝트를 개발 서버에서 실행시킬 때 보통 터미널에서 npm run dev 로 실행하는데 모바일 기기로도 확인할 수 있으면 좋을 것 같아서 방법을 찾아봤다. 맥북과 아이폰을 사용한다는 전제하에 설명해보겠다. 방법 1. 먼저 아이폰과 맥북은 동일한 와이파이에 접속해야한다. 2. 맥북 터미널에서 다음과 같은 명령어를 입력한다 ipconfig getifaddr en0 그러면 IP 주소가 뜨는데, https:// 로 모바일에서 사파리로 접속하면 된다. 하지만 나는 제대로 연결되지 않아서 추가적인 과정을 하나 더 해줘야했다. ref:https://dev.to/bhendi/how-to-open-your-vite-dev-server-on-your-mobile-k1k 3. React 프..
React 프로젝트 생성 타입스크립트의 셋팅이 완료된 새로운 프로젝트를 생성하는 법이다 npx create-react-app 프로젝트명 --template typescript 만약 기존 프로젝트에 타입스크립트만 추가하고 싶다면 다음과 같이 터미널에 입력한다 npm install --save typescript @types/node @types/react @types/react-dom @types/jest Typescript로 만든 React 프로젝트 일반 프로젝트와 다른 점은 컴포넌트 파일에 js 가 아닌 tsx 확장자를 사용해야한다는 것이다. 그러면 리액트 프로젝트에서 typescript 문법을 어디에 응용할 수 있을지 알아보자 JSX 타입지정 리액트에서는 변수나 자료에 를 담아서 쓸 수 있다. 리액트..
안녕하세요 dawonny 입니다. 개발자 직무를 희망하는 저는 개발을 할 때에 맥북이 좋다는 말을 정말 수없이 들어왔는데요.아이폰, 아이패드, 애플워치, 에어팟… 모든 게 다 애플꺼면서 정작 노트북은 다른 기업 제품을 쓰고 있었어요.그래서 저도 6개월 전쯤에 처음으로 맥북을 구매하게 되었는데, 정말 다른 기기들과의 연동성이 최고더라구요. 현재 아주 잘 쓰고 있어요!하지만 지금까지 써왔던 윈도우 기반이랑은 꽤 많이 다르기에 처음엔 많이 헤맸던 기억이 나네요.주변 맥북 유저 지인들을 보면서 설정이나 유용한 기능들을 하나하나 물어보고 구글링하면서 저만의 맥북 환경을 열심히 커스텀 했어요. 그러다 《된다! 맥북&아이맥 - 맥OS 소노마》 도서를 좋은 기회로 받아보게 되었는데요.처음에 맥북을 샀을 때 이 책이 있..
Generic function 함수(x: unknown[]) { return x[0]; } let a = 함수([4,2]) console.log(a) 위와 같은 코드를 보자. unknown 타입의 array 자료를 입력하면, array의 맨 앞 첫번째의 요소를 리턴해주는 함수가 있다고 해보자. console.log 로 콘솔에 찍힌 a 의 타입은 뭘까? unknown 이다. 입력하는 array 도 unknown 타입이기 때문이다. function 함수(x: unknown[]) { return x[0]; } let a = 함수([4,2]) console.log(a + 1) 때문에 이런 경우에는 에러가 날 것이다. 왜냐하면 a 는 unknown 타입인데, 숫자인 1을 더하려고 했기 때문이다. 이런 문제를 해결..
