2donny

AWS로 배포하려고 요즘 애를 많이 먹고있다. 현 상황은 Node.js 기반 서버를 로컬에서 테스트하고 있는 상황이다. 근데 nginx로 프록싱도 해야해서 docker-compose를 쓰는 상황이다. 문제가 된 Node.js 이미지를 빌드하는 Dockerifle을 보자 그리고 docker-compose.yml 파일을 아래와 같이 작성함. 그런 후, 아래 명령어를 실행함. > docker-compose up --build 근데 실행할 때 마다 밑에같은 에러가 발생했음. no such file or directory, open '/usr/src/app/package.json' 도커 컨테이너 런타임에 /usr/src/app/package.json 파일이 존재하지 않는다는 에러이다. 이 에러는 Dockerfil..

이번 글에서 Webpack, Parcel를 공부하면서 이러한 기술을 어떻게(How) 사용하는지 보다 대체 이걸 왜(Why) 사용하는지를 내가 이해한 방식을 토대로 글을 쓰려고 한다. 물론 뒤에 실습 코드도 나와있으니 인내심을 갖고 글을 쭉 읽은 후에 코드를 보면 어느정도 납득이 될 것이다. 먼저, What is parcel? Parel은 Webpack과 함께 bundler 시장의 점유율을 나눠갖고 있는 모듈 번들러이다. 번들러(bundler)란 dependency가 있는 자바스크립트 파일들을 최적화, 압축하여 하나 혹은 여러개의 static 파일로 빌드해주는 컴파일러이다. Why parcel? 질문에 대한 답을 하기 전에 먼저 브라우저 내부 엔진에 대한 이해가 필요하다(이전 포스팅을 참조). 브라우저의 ..

이 글은 이스라엘 개발자 탈리 가르시엘이 게시한 "How Browsers Work: Behind the scenes of modern web browsers"라는 글을 바탕으로 정리한 글입니다. 가르시엘은 millions 단위나 되는 C++ 랜더링 엔진 소스코드를 직접 분석하면서 어떻게 웹 브라우저가 동작하는지 파악하였다고 합니다. 웹 브라우저가 무엇인가? 웹 브라우저는 서버에서 받은 HTML, CSS, Javascript 파일을 받아서 브라우저 내부 "랜더링 엔진"의 Parser(파서)를 통해 문서들을 Parser tree로 만들고 순서대로 화면에 배치합니다. 웹 브라우저의 구조 1. User Interface : URL을 입력할 수 있는 주소 표시줄, 이전/다음 버튼, 새로고침 버튼, 중지 버튼, 북..

학기가 끝난 지금, 처음으로 올 한 해를 활자로써 되돌아 보고자 한다. 올해는 내 삶 어느 한 해보다 꽤 많은 것들을 했었고 해나가고 있는 중이다. 작고 귀여운 내 첫 이력.. 삼성에서 주관하는 "주니어 소프트 히어로즈"의 챗봇 개발 멘토. E-ICON 세계대회 주관 중, 고등학생 앱 개발 멘토. 케어링앤컴퍼니에서 웹 개발 외주. 고커톤 [앱 개발] 그리고 방학을 맞이한 지금은 고맙게도 지인의 연락을 받아 학교에서 주관하는 해커톤에 같이 참여하게 되었다. 총 5명의 브레인 스토밍으로 아이디어까지 정한 상태인데 정말 스타트업의 고뇌를 작게나마 간접 경험하고 있는 중이다. 사람들의 생각들은 어찌나 다르던지. 자신의 아이디어를 말로 표현하고 또 그것에 대하여 다른 사람들이 문제점을 제기하는 과정에서 이제까지는..

Speech recognition이란 사람의 음성을 텍스트로 변환해주는 Speech-to-text(SST) 기술이다. 현재 진행하고 있는 프로젝트에 이 기술이 필요하게 되어서 다양한 API를 찾아보다가 대부분 유료인 것이 걸려 (네이버 Clova는 api가 직관적이고 옵션이 좋았는데 1초에 15원이었다..) 포기할 때 쯤 Web speech API를 찾게 되었다. 무료로 기술을 제공을 해준다는 점 뿐만 아니라 레퍼런스가 매우 잘 정리되어있다는 점에서 이것을 정리해보기로 했다. 내가 참고한 자료는 MDN 웹 문서이고 지금부터 내가 사용하기에 유용했던 인터페이스와 그것의 Property 밑 Method를 내용을 정리해보겠다. 먼저 이 Web speech API는 어떤 식으로 동작하는가? Speech reco..

Typescript 사용하는 이유 Javascript는 dynamically typed language입니다. 즉, 런 타임에 타입이 정해지기 때문에 개발자들이 개발할 때(compile time) 없었던 에러가 클라이언트의 웹 브라우저(Run time)에서 일어날 수 있습니다. 이러한 치명적인 일을 방지하기 위해 규모가 있는 애플리케이션에서는 Type checker 역할을 하는 Typescript를 사용하여 개발합니다. Typescript는 다른게 아니라 typescript file을 javascript file로 컴파일하는 "컴파일러"입니다. 코드가 한번 컴파일되면, 결과로 나온 js 파일은 타입 정보가 없습니다. 이는 ES6+ 문법을 ES5로 컴파일해주는 Babel과 매우 유사합니다. 1. 일단 해보..

이 글은 CPU를 보다 심도있게 이해하기 위해서 꼭 알아야하는 Instruction set Architecture와 관련 컴퓨터 구조에 대해서 누구나 이해하기 쉽게 정리하는 글입니다. 글을 쓰는 목적은 전공 공부를 하며 이해하기 힘들었던 부분, 혹은 설명이 어려웠던 부분들을 내가 이해하기 쉽게 정리하기 위함입니다. 이 글의 내용은 고려대학교 정성우 교수님의 "컴퓨터구조" 수업 내용을 들으면서 제가 이해한 것을 바탕으로 정리하였습니다. 교수님의 "명강의"가 저라는 "statement"에 의해 side-effect가 생길수도 있으니 오류가 보이시면 언제든지 지적해주시면 감사하겠습니다. 그러면 시작해보겠습니다. ISA(Instruction set architecture) 왜 배워야 하는가? 간단하게 생각하면 ..