프론트엔드 정복하기

소스맵이란 무엇일까? 소스맵에 대한 블로그 글을 개념 숙지 겸 간단히 정리해 보았다. 소스 맵이란? - 코드의 원본 소스와 변환된 소스 사이의 맵핑 정보가 선언된 파일이다. - *.map 확장자이며, JSON 형태로 되어 있다. - 이 파일을 웹 서버에 제공하면 브라우저는 소스맵을 적용해 변환된 코드를 디버깅할 수 있다. - 일반적으로 Vite, Webpack 등의 번들러에서 소스맵 생성 옵션을 제공한다. - 파일 내용 중 'mappings'라는 키값이 원본소스와 변형된 소스 간 관계를 나타내고, 아래처럼 VLQ Base64 형태로 인코딩된 문자열이다. AAAA,SAAS,cAAc,WAAW,iBAAiB,SAAS;IAC1D,... 소스맵이 필요한 이유는? 웹 브라우저에서 소스맵이 없으면 디버깅하기가 어렵다...

서버에서 웹 애플리케이션을 운영할 때 Node 서버를 띄우기 위한.. npm 으로 전역에 pm2 를 설치해 사용한다. npm install pm2 -g // 앱 실행 pm2 start app.js // 실행된 프로세스 목록 pm2 list // 현재 서버에서 실행되고있는 app이 git의 어떤 소스를 기반으로 실행되어있는지 확인 pm2 show app.js // 앱 재시작 pm2 restart app.js // 앱 중단 pm2 stop app.js // 프로세스 목록에서 제거 pm2 delete app.js // pm2 데몬 자체를 죽이려면 pm2 kill // 로그 기록 확인 pm2 logs pm2 logs app.js ** json 파일을 만들어 해당 설정대로 서버를 실행할 수도 있다. // ecos..

https://hanamon.kr/%EB%A6%AC%EB%88%85%EC%8A%A4%EB%8A%94-%EB%AC%B4%EC%97%87%EC%9D%B4%EA%B3%A0-%EC%9A%B0%EB%B6%84%ED%88%AC%EB%8A%94-%EB%AC%B4%EC%97%87%EC%9D%B8%EA%B0%80/ 리눅스(Linux)는 무엇이고 우분투(Ubuntu)는 무엇인가 - 하나몬 ❗️리눅스(Linux)란? 👉 Linux는 커널이다. ⇒ 커스텀 OS 만들기 가능 Windows나 Mac과 달리 Linux는 실제로 분리되고 잘 정의된 운영 체제가 아니다. 오히려 Linux는 커스터마이즈된 OS를 만들 수 있는 커 hanamon.kr https://story.pxd.co.kr/732 우분투(ubuntu)란 무엇인가? 1..

사용 목적 - 비밀 설정 정보 관리 DB connection, API Key 등 비밀 정보가 노출되지 않도록 별도 관리가 필요함 유의점 .env 는 암호화된 파일이 아니다. 조회/수정 모두 가능하다. 따라서 .gitingnore 를 통해 해당 파일이 버전 관리 되지 않도록 해야 한다. .json, Object 등을 사용하지 않고 왜 굳이 .env 를 사용하는 것일까? - .json 단점 - 파싱 작업이 들어가야 한다. - 데이터가 추가될 때마다 set 해줘야 한다. - .env 장점 - 배포 시 Shell 로 변경이 가능하여 수정이 용이하고, ShellScript(?) 를 이용해 SSH, CI/CD 에서 활약을 기대할 수 있다. - express 에서는 NODE_ENV 라는 환경변수를 통해 개발환경과 운..

Redis 는 ?) 다음과 같은 특징을 갖는 Data Structure 이다. 1) Remote에 위치한 2) 프로세스로 존재하는 3) In-Memory - 메모리 기반의 4) 키-값 구조의 데이터관리 시스템 5) String, Set, Sorted Set, Hash, List 의 자료 구조를 지원함. ( = Collection 제공) 위 자료구조를 1)캐시 또는 2) Persistence Data Storage로 사용가능한데, 보통 Cache로 많이 쓰인다. 캐시를 사용하는 이유) 서비스 사용자가 증가했을 때, 모든 유저의 요청을 DB 접근으로만 처리하게 된다면 DB 서버에 무리가 갈 수 밖에 없다. 물론 데이터베이스는 데이터를 디스크에 저장하기 때문에 서버의 장애와는 별개로 데이터를 유지할 수는 있지..

Microsoft Flow는 microsoft가 비교적 최근에 선보인 신생 앱니다. MS Flow를 활용할 경우 업무를 자동화할 수 있는 프로세스를 쉽게 구현할 수 있게 된다. 가령, 간단한 전자결재와 승인 프로세스를 쉽게 구현할 수 있고, 오피스나 원드라이브 등에 입력된 정보를 자동으로 한 군데에서 통합 관리할 수 있다. Office365 앱과 서비스 사이에 자동화된 워크플로우를 설정해서 외부 앱들이나 오피스 365 서비스들간에 필요한 파일 동기화, 알림 수신, 데이터 수집 등의 작업을 한 군데에서 통합하여 사용할 수 있다. 예를 들어, 상사에게 이메일이 오면 => 문자 메시지로 알람이 오도록 플로우를 설정했어요. 관심있는 트윗이 => 엑셀에 모이도록 플로우를 설정했어요. 중요도 높은 메일 수신 시 -..