profile
누구나 할 수 있지만 아무나 못하는 일을 하자

[남도학숙 식단 어플] 3. 크롤링 방식 변경(puppeteer 사용 X -> api 요청 방식)

1. 문제상황 지난글에서 나는 cheerio와 puppeteer를 이용해서 식단표를 크롤링하는데 성공했다 그런데, 마음에 들지 않는 부분이 있었다. 그것은 바로 <span

2022년 11월 12일
·
0개의 댓글
·

[Photorage] 4-1. React + Vite + Storybook VS Code 절대경로 설정

VS Code를 이용하면 각 파일을 import 해줄 때 우리는 종종 아래와 같은 형식을 사용한다. ex) import Button from '../../../src/components/Button' 이는 상대경로로 현재 import 하는 파일의 디렉토리 기준

2022년 7월 29일
·
0개의 댓글
·

[React] 당신의 React 코드를 2분만에 리팩토링 하는 매우 쉬운 방법

원문 링크 - https://medium.com/@chrlschn/is-this-the-easiest-2-min-refactoring-to-improve-your-react-code-5a5d9e0547f0 이 글은 위의 원문을 번역한 글입니다. 혹시 리액트 코드를 작

2022년 6월 8일
·
0개의 댓글
·
post-thumbnail

[Photorage] 3. React + Spring 을 AWS EC2 Nginx로 배포하기

지난 포스팅에서 프로젝트를 Vite로 만들고 스토리북까지 추가해봤다. 이번에는 리액트로 만들 웹을 AWS의 EC2 제품을 이용하여 배포하는 인프라를 구축 해보겠다. 글 제목이 React + Spring이라 헷갈릴 수도 있을 것 같다. 정확히 우리 프로젝트는 MSA로

2022년 5월 30일
·
0개의 댓글
·
post-thumbnail

[Photorage] 2. React + TypeScript를 Vite로 시작하기(스토리북 추가)

이번엔 Vite를 이용하여 프로젝트를 생성 하고 사용하고자 하는 추가 개발 도구들(스토리북 등)을 설치 해보자. 그 전에 앞서 npm 이나 yarn 이 설치가 되어있지 않은 분들은 그것을 먼저 설치 하도록 하자. 참고 링크 - https&#x3A;//heropy.bl

2022년 5월 26일
·
0개의 댓글
·
post-thumbnail

[Photorage] 1-3. CRA 대안 선택(Vite React)

1.에서 CRA가 아닌 Vite를 사용하기로 했다. 이번엔 바이트를 이용하여 프로젝트를 생성 하고 사용하고자 하는 추가 개발 도구들(스토리북 등)을 설치 해보자. yarn create vite [프로젝트 명] --template react-ts 사용 시 ![](ht

2022년 5월 26일
·
0개의 댓글
·

[Photorage] 1-2. CRA 없이 React + TypeScript 개발환경 구축하기

지난 글 1-1. React CRA가 최선이고 최고일까?에 이어지는 글입니다. 나는 CRA를 안쓰고 싶었으며, 빠른 빌드 도구인 esbuild 존재를 알았기 때문에 CRA 없이 React + TypeScript의 개발환경을 세팅하는 방법을 우선 알아보았다. 패키지

2022년 5월 26일
·
0개의 댓글
·

[Photorage] 1-1. React CRA가 최선이고 최고일까?

공부 배경 내가 ICT 인턴을 진행하는 기업의 서비스는 90%가 Vanila TypeScript로 이루어져있고, 요새 새로 추가하는 신규 기능 같은 경우는 React를 통해 개발을 진행하고 있다. 나는 입사 당시만해도 React를 전혀 몰랐기 때문에 아무런 감흥도 없었

2022년 5월 17일
·
0개의 댓글
·

[배경 지식] 번들러(Bundler) 에 대해서

포스팅 배경 아래는 ICT 인턴십을 준비하며 기업 면접에서 받았던 질문과 답변 내용이다. > Q. FrontEnd 개발자 로서 현재 프로젝트가 느리다고 생각될 때, 어떠한 조치를 취할 수 있겠습니까? A. 시간이 걸리는 동안 로딩되는 표시를 띄워 사용자로 하여금 현재

2022년 5월 17일
·
0개의 댓글
·

[Photorage] 0. 토이 팀 프로젝트 시작

프로젝트 요약 사진 기반의 SNS가 넘쳐나는데, 다른 SNS 서비스들과 다르게 "앨범" 이라는 개념을 조금 더 강하게 도입하고자 함. 기존 SNS의 복잡한 기능들 대신 일상/여행의 앨범이라는 개념만으로 구현. 친구들끼리의 추억, 가족들끼리의 추억을 담은 앨범으로 시작

2022년 5월 17일
·
0개의 댓글
·
post-thumbnail

[배경 지식] 컴파일, 빌드, 배포 개념 및 CI/CD 개념 정리

컴퓨터가 이해할 수 있는 언어로 바꿔주는 과정보통 Java, C자바스크립트에서의 컴파일러는 Babel과 Typescript 등이 있다. Babel을 통해 최신 자바스크립트 스펙을 모든 브라우저에서 사용 가능한 스크립트로 컴파일Typescript를 통해 TS -> JS

2022년 5월 16일
·
0개의 댓글
·
post-thumbnail

[남도학숙 식단 어플] 2. Node.js를 로그인이 필요한 페이지 크롤링 하기

🙏 크롤링이란? 나는 현재 남도 학숙(지역 학사)에 살고 있다. 그렇게 아침과 저녁을 보통 학숙에서 나오는 밥을 먹는데, 매번 식사 메뉴를 확인하기 위해서는 아래와 같은 과정을 거쳐야 했다. 핸드폰 크롬에 남도학숙 검색. 남도학숙 사이트에서 남도학숙 학사관리 시스템

2022년 5월 15일
·
0개의 댓글
·

[vscode] 디렉토리 폴더 구조 겹침 없애기

1. 상황 설명 vscode를 사용하다보면 한번씩 좌측에 있는 탐색기에 하위 폴더가 / 로 보이는 경험을 겪은 적 있을겁니다. 하위 폴더면 하위 폴더 답게 계층구조를 지켜서 화면에 보였으면 한 것이 한 두번이 아닙니다. 해당 문제를 해결하는 것은 매우 간단합니다.

2022년 5월 10일
·
2개의 댓글
·
post-thumbnail

2. CRA(JS) -> CRA(TS) 변환 실습

테스트 CRA JS : npx create-react-app test TS: npx create-react-app testts —template typescript [프로젝트 구조] [package.json] [tsconfi

2022년 4월 29일
·
0개의 댓글
·
post-thumbnail

1. 배경 및 변환 전략

내 지난 포스팅 React-Storybook 0. 프로젝트 생성 및 스토리북 등록 에서 나는 앞으로 내가 만들게 될 리액트 컴포넌트 들을 최대한 재사용성을 높여서 등록하고, 그것들을 모아두겠다고 말했었다. 그렇게 CRA를 이용하여 프로젝트를 만들어 봤었다. 그런데 여기

2022년 4월 28일
·
0개의 댓글
·
post-thumbnail

[배경 지식] Storybook 시작하기(feat. React + TypeScript)

ICT 인턴을 '미리디' 라는 기업에서 미리캔버스 라는 웹사이트의 프론트엔드 개발자로 진행하고 있다. 여러가지 공부를 하고 있는데, 여기서 알게 된 것이 스토리북 이라는 것이다.이 가이드는 전문 개발자들이 디자인 시스템을 배울 수 있는 방법을 다루고 있습니다. 자바스크

2022년 4월 28일
·
0개의 댓글
·

[JavaScript] 참조형 및 원시형 타입

JavaScript는 두 가지 원시 타입(Primitive Type)과 참조타입(Reference Type)이 있다.원시 타입은 쉽게 말해, 정수, 실수, 문자, 논리 리터럴등의 실제 데이터 값을 저장하는 타입이고,참조 타입은 객체(Object)의 번지를 참조(주소를

2022년 3월 27일
·
0개의 댓글
·

[남도학숙 식단 어플] 1. 등장 배경 및 기능 정의

나는 현재 남도 학숙(지역 학사)에 살고 있다. 그렇게 아침과 저녁을 보통 학숙에서 나오는 밥을 먹는데, 매번 식사 메뉴를 확인하기 위해서는 아래와 같은 과정을 거쳐야 했다.핸드폰 크롬에 남도학숙 검색.남도학숙 사이트에서 남도학숙 학사관리 시스템 입장.로그인학생 생활

2022년 3월 24일
·
0개의 댓글
·

[무작정 포트폴리오] 4. 깃헙 페이지에서 동작하는 SPA(Vanilla JS) - 잠정 중단

[미리보기] 참고자료 : SPA without server(깃헙 페이지 동작 가능) 하게 해준 github repo 문제점 지난번 [무작정 포트폴리오] 3. SPA 구현(Vanilla JS)에서 SPA 구현에 성공한 듯

2022년 3월 15일
·
0개의 댓글
·
post-thumbnail

[ICT 인턴십] 3. 탈락 후 추가 합격!!

지난 \[ICT 인턴십] 2. 코딩테스트 및 면접에서 최종 탈락을 하면 글을 마무리 하겠다고 했다. 그러나 제목에서 이미 알 수 있듯이 추가합격으로 ICT 인턴십에 합류하게 되었다. 2.19 ~ 2.21 까지가 합격한 학생이 인턴 기업을 확정하는 기간이었다. 나는 안타

2022년 2월 22일
·
0개의 댓글
·