profile
SUNNY SUMMER ! 같이 일하고 싶은 개발자 여름이의 초심을 잃지 않기 위한 주절주절 부트캠프 시절 블로그.
태그 목록
전체보기 (42)코드캠프(27)개발자(26)개발자취업(25)코딩부트캠프(24)프론트엔드(20)코딩(18)202203(4)코드캠프6기(4)accesstoken(3)코드부트캠프(3)localstorage(3)prev()(3)SSR(3)State(2)modal(2)스택(2)refetch(2)lodash(2)JWT(2)hydration(2)json(2)axios(2)배포(2)useEffect(2)(2)Apollo client(2)container(2)diffing(2)ant Design(2)구조분해할당(2)얕은복사(2)cookie(2)props.children(2)React-slick(2)reduce(2)lb(2)typescript(2)제어 컴포넌트(2)VM인스턴스(2)Map(2)postman(2)codegen(2)node.js(2)GCP(2)Firebase(2)Presenter(2)삼항연산자(2)React(2)Props(2)로드밸런서(2)authorization(2)DNS(2)restapi(2)component(1)controllered component(1)refactoring(1)깊은 복사(1)hooks(1)uuid(1)promise(1)sql(1)import(1)디바운싱(1)Math.abs()(1)withAuth(1)서버컴퓨터(1)깊은복사(1)Azure(1)global state(1)API(1)ORM(1)link(1)header(1)prompt(1)컴포넌트 재사용성(1)library(1)라이브러리(1)OOP(1)객체지향프로그래밍(1)userInfo(1)JSON.stringify(1)google cloud storage(1)아임포트 웹 훅 노티피케이션(1)proxy서버(1)graphql-request(1)public API(1)호이스팅(1)loadbalancer(1)무한스크롤(1)elasticsearch(1)typeof window(1)REST(1)Proxy(1)React Draft Wysiwyg(1)dependency array(1)JSON.parse(1)bearer(1)Under-Fetching(1)Cache(1)브라우저저장소(1)메모이제이션(1)컴포넌트생명주기(1)인증 테이블 파티셔닝(1)cypress(1)비제어 컴포넌트(1)개밪자취업(1)시멘틱 태그(1)Index(1)FileReader(1)rest parameter(1)Class Component(1).tsx(1)지도API(1)스코프체인(1).webp(1)PORT(1)eslink(1)연산자(1)callback(1)DOMPurify(1)componentdidupdate(1)updateboardid(1)OpenGraph(1)lazyload(1)반응형 웹(1)pre-rendering(1)react hook form(1)MPA(1)router(1)dynamic-import(1)input(1)낙관적 UI(1)preload(1)pg(1)foit(1)역색인(1)SaaS(1)PaaS(1)SearchEngineOptimization(1)globalState(1)Recoil(1)while문(1)await(1)sessionStorage(1)Over-Fetching(1)w(1)ajax(1)early exit(1)PageSpeedInsights(1)NTP시간동기화(1)client.query(1)async await(1)Recharts(1)app.tsx(1)async(1)내장객체(1)class(1)cloud storage service(1)JavaScript(1)export(1)pagination(1)daas(1)웹에디터(1)graphql(1)Banner(1)next build(1)타입스크립트(1)Prettier(1)Memoizaion(1)렉시컬디스(1)Debouncing(1)코드젠(1)asPath(1)optional chaining(1)비동기 통신(1)layout(1)cascade Style-Sheet(1)trailingSlash(1)refresh_token(1)Generic(1)Math.sqrt()(1)Hashing(1)Encoded(1)replaceAll(1)시간관련이벤트(1)ssh(1)검색프로세스(1)any(1)https(1)@media(1)forward(1)pathname(1)imp_uid(1)Optimistic UI(1)codegenerator(1)fout(1)docker(1)localStorage.setItem(1)componentWillUnmount()(1)filter(1)Husky(1)open API(1)react-daum-postcode(1)VM-WARE(1)bass(1)스토리북(1)key(1)fetchpolicy(1)context(1)extends component(1)useLazyQuery(1)apollo server(1)GRAPHQL_API(1)useMemo(1)useRef(1)cache.modify(1)this(1)ApolloProvider(1)navigation(1)event bubbling(1)operation(1)health checker(1)테스트코드(1)Decoded(1)e2e테스트(1)tokenizing(1)refetchQueries(1)round robin(1)Number.isInteger()(1)결제 프로세스(1)inverted index(1)useCallback(1)repaint()(1)디스크기반 데이터 베이스(1)destructing assignment(1)스프레드연산자(1)least-connection(1)스프레드 연산자(1)서버사이드렌더링(1)splice(1)storage(1)스토리지(1)정적배포(1).ts(1)MultiPageApplication(1)HoF(1)VariablesEnvironment(1)의존성배열(1)templete literal(1)meta(1)react-infinite-scroller(1)tryCatch(1)shallow copy(1)graphql mutation(1)알고리즘_정규표현식(1)실행 컨텍스트(1)yup(1)spa(1)클라우드프로바이더(1)jest(1)HoC(1)nosql(1)table fullscan(1)Payment Gateway(1)조건부렌더링(1)kakao map(1)aws(1)검색엔진최적화(1)seo(1)JSX(1)메모리기반 데이터 베이스(1)Swagger(1)ssg(1)HighOrderComponent(1)OG(1)이벤트 버블링(1)event delegation(1)Recursive Functions(1)리눅스(1)Database(1)hydration css error(1)CRUD(1)파이어베이스(1)mutation(1)EL(1)개발자 취업(1)Playground(1)LiftingStateUp(1)CustomHooks(1)토크나이징(1)권한분기(1)UNAUTHENTED(1)Throttling(1)Global styles(1)openapi(1)componentDidMount(1)구조분해 할당(1)TDZ(Temperal Dead Zone)(1)reflow(1)algorithm(1)deep copy(1)closure(1)SQLD(1)memo(1)component-lifecycle(1)promise.all(1)도커(1)서버프로그램(1)쓰로틀링(1)ServerSideRendering(1)git(1)react-quill(1)headers(1)instanceof Element(1)isActive(1)이미지프로세스(1)thisBinding(1)SinglePageApplication(1)readAsDataURL()(1)snapShotTest(1)routing(1)args(1)CloudProvider(1)정규표현식(1)Client Side Rendering(1)yupResolver(1)optimisticResponse(1)인증(1)Carousel(1)usequery(1)비구조화 할당(1)cors(1)인가(1)UTC시간(1)
post-thumbnail

[원티드 프리온보딩 프론트엔드 인턴십] 참가 에세이 - 김아름

숏 에세이\-> 올해 3월에 부트캠프에 들어와, 약 4개월을 미친듯이 코딩하고..! 부트캠프의 멘토로서 약 5개월간 일을 했다. 그리고 지금은 한 회사의 개발팀의 리액트 개발자로서 1달째 실무경험을 쌓고있다!하지만, 너무나 주니어 개발자인 나로서, 기초적인 토대가 아직

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

개발자의 지식 3) CI/CD(지속적 통합/지속적 제공): 개념, 방법, 장점, 구현 과정/ Atomic Design Pattern / OOP vs FP

CI/CD는 애플리케이션 개발 단계를 자동화하여 애플리케이션을 보다 짧은 주기로 고객에게 제공하는 방법입니다. CI/CD의 기본 개념은 지속적인 통합, 지속적인 서비스 제공, 지속적인 배포입니다. CI/CD는 새로운 코드 통합으로 인해 개발 및 운영팀에 발생하는 문제(

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

개발자의 지식2) 재귀함수/ flatten과 unflatten/Observable/- reduce/ React-router vs Next-router/ This 와 Binding

재귀란 원래의 자리로 되돌아가거나 되돌아온다는 뜻! 재귀함수란 어떠한 함수가 있을 때 그 안에서 자기자신을 호출하는 함수를 의미한다 ! 위 example 함수는 return 값으로 자기 자신을 불러오며불러올 때 매개변수인 count를 -1해주고 결과값을 +2 해준다\-

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

개발자의 지식 1) JS 기본상식 총정리!

==와 ===의 차이를 알아보자 ! mdn docs에서 찾아볼수 있는 개념으로는,==는 추상적 같음 비교, ===는 엄격한 같음 비교에 쓰인다고 나와있다. === 를 사용하는 엄격한 같음\-> 엄격한 같음(strict equality)은 두 값이 같은 지 비교합니다.

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

37일차) 프론트엔드 개발자가 Docker까지 알아야할까요? 실무에서는 Dockerfile안에 작업할 파일들과 프로그램을 넣어놓고 주면서 이거 하세요! 하고 던져주는 일이 빈번....!

\- 정적배포도 https로 가뿐히 바꿔주고 시작해볼까유이제 내가 배포했던 사이트 yarn start해주고, 수정할거 생기면다시 깃 클론하고 yarn build해서 켜주는거 과정 머릿속에 있어야한다!다른 컴터에서도 들어갈수 있는 외부ip주소배포는..이제 익숙해!!\->

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

36일) http 안돼 https로 해줄꺼야. 뭐가다른데?! 와이어샤크로 너 정보 다 털릴수도 있거든... code camp FE 6기

우리 이렇게 들어가서 보면, 기본값이 맵핑된 주소였지!http인것을 볼 수 있다근데 주소입력해서 들어가는것이, 바로 맵핑이 진행되는게 아냐!naver.com armysssir.shop..이런주소들을 모아놓는 서버를 root dns서버라고 한다 ! 전세계에 13대가 있다

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

35일) 배포의 시작, 정적배포부터 해보자! GCP/ 로드밸런서야 고마워!/가비아 550원/ SSG 배포과정 / CODE CAMP FE 6기

전체적 그림 복습 ! dns가 브라우져에서 ~.com 요청 받으면 ,요청을 ip주소로 바꾸어서 따로 lb(로드벨런서에)보내준다고 했지!그러면 로드밸런서는 ssr(서버사이드렌더링) ssg(스토리지에 저장된 정적파일!)에따라 요청을 분기를 처리한다 . 스토리지에 정적파일

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

34일) 내가 만든 사이트를 세상에 공개한다..! 배포준비와 이에 따르는 책임들 / GCP/SSH/Loadbalancer/테스트코드 CODE CAMP FE 6기

하.. 너무 아쉬운 코캠의 마지막 8주차 커리큘럼 내가 로컬호스트로 틀어서만 확인 가능했던 사이트를 도메인을 직접 사서 배포 할 수 있다니 ?! 정말 너무나 설레는군...? (오류없이 포폴을 잘 만들어 놓자)게다가 깃헙으로 협업까지 배운다고 한다.. 정말 실무로 나가기

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

33일) 사이트 만들고, 기능연결만 되면 그게 개발자야? 찐 프론트엔드는 성능을 높이고 ! 최대한 빨리빨리! 과부하는 없도록! 최적화! Optimistic-UI/ SSR/ SEO CODE CAMP FE 6기

\-> 실패해도 큰 영향이 없는 데이터, 실패할 가능성이 많이 없는 데이터에만 사용하자 !실제로 99% 성공확률일때만 쓰세요! 라고 나와있다 (여러테이블에서 사용하지 않는 데이터일수록 Good)게시물 좋아요 기능을 생각해 봤을때, 게시물 좋아요를 누르고 다시 fetch

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

32일차) 코드캠프에서는 실무 작성 코드 위주가 1순위랍니다 / memoization/메모이제이션/usememo/useCallback/reflow/repaint

실무 작성 코드 위주로 배우자, 자꾸 새로 만들지 말고 , 메모해 놓는거 어때 ? \-컴포넌트를 만들어놓고 봐보자 State는 변경되면서 컴포넌트가 바뀌면서 페이지가 리렌더링이 된다문제는 countLet이 State누를때마다 같이 초기화 됨(화면에도 안나타나고)\-특정

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

31일차) 언제까지 사진 한 장씩 올리는거 기다릴거야! FileReader/readAsDataURL/Promise.all/ 실무 위주 !성능 높여 ! 끌어올려! Code Camp FE 6기

오늘 배울 내용 우리가 기존에 쓰던 이미지 업로드 방식 백엔드의 uploadFile api요청을 통해서 storage에 사진을 저장하고, url을 받아와서 브라우저에 url을 넘겨주었었다.그 다음에 그 url을 첨부해서 createBoard api요청을 해서게시글에 이

2022년 4월 26일
·
2개의 댓글
·
post-thumbnail

30일) 유저들은 모를거야.. 로그인하고 토큰이 만료되면, refreshToken으로 쥐도새도 모르게 새로운 accessToken을 바꿔치기 한다는것을 ..! / JWT/UNAUTHENTED error/ CODE CAMP FE 6기

7주차의 커리큘럼 ! (꺄 드뎌 refreshToken 배워서 토큰만료 에러를 보지 않을수 있게 되었다!)우리는 여지껏 토큰 만료가 되는 accesstoken을 썼었다 (로그인해서 토큰 받아와서 로컬스토리지에 저장해주는 방식으로!)\-백엔드 컴퓨터에 메모리세션에 로그인

2022년 4월 25일
·
2개의 댓글
·
post-thumbnail

React 추가 개념 정리) Context API 와 Redux 비교, swr , mobx, react - curring

전역 상태 관리우선, React의 useState를 이용하면 지역 상태 관리를 할 수 있습니다. 이를 사용하는 컴포넌트 안 혹은 props로 전달할 때만 하위 컴포넌트에서 사용할 수 있습니다.모든 상태 관리를 useState만을 이용하여 진행할 수도 있습니다. 하지만

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

29일차) 카카오 지도를 가져와서 써보자! /Client Side Rendering/멀티,싱글page application을 알아야해/시멘틱 태그/ callback함수, Promise, async-await의 역사까지! Code Camp FE 6기

오늘 배울 내용 \-네이버 구글 카카오등등..개발자 전용 사이트가 있었네!\-카카오 개발자 사이트에 가입해서 내 애플리케이션 추가해보자(폴더라고 생각)

2022년 4월 22일
·
1개의 댓글
·
post-thumbnail

28일) 드디어..내가 맨땅에 만든 페이지에서 내가 정한 이름과 금액으로!! 실제 결제가 가능하다니! 결제 프로세스/Payment Gateway/ imp_uid/ 이벤트 루프/ Code Camp FE 6기

\-카드결제\-계좌이체\-무통장입금\-정기결제이것들은 다 따로 결제프로세스를 만들어야 한다 ! 보통은 결제 대행 업체가 있다! -> Payment Gate 회사들PG사와 협업 해야함(NHN, 나이스페이, KG이니시스등등..)\-pg에 가입, 계약, 코드를 받아서 결제

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

26일) 그놈의 generic이 뭐에요ㅠ typescript 심화/Cookie/LocalStorage/SessionStorage / 장바구니를 브라우저 안에 담아줘보자 ! Code Camp FE 6기

우리가 배웠던 자바스크립트같은 any타입 ! 아무거나 넣어줘!비슷한.. 나는 모르겠어! 라고 말하는 unknown 타입\- 비회원 전용 장바구니가 있다구 ? localStorage 응용 Basket

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

25일 ) 비구조화 할당 알고나면 쓸 수 밖에 없는 편리함/ Rest-parameter/ 내가 useState같은걸 만든다고?! Custom Hooks/refetch 대신 Cache.modify하자! Code Camp FE 6기

신나는 6주차의 커리큘럼 !!!(와씨 타입스크립트쓰다가 맨날 가능한 제네릭이 아닙니다..그놈의 제네릭 제네릭으리아ㅡㄹ아거!!!!1이랬는데 드디어 배운다 ㅠㅠ!!!!!!!!!!)기존에 객체에있는 값을 꺼내올때 간편하게 표현하게 하기 위해 적는 방식이 비구조화 할당 ! 중

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

24일) useQuery로 바로 안불러오고 useApolloClient로 axios처럼 원하는 위치에서 data 불러올래요! YUP! react HOOK! code camp FE 6기

오늘의 알고리즘 문제 ! 마지막에 갓범수님한테 int의 범위에 대해 듣게되고 맞추었다...!숫자의 타입 정리해놓차오늘 배울것요청과 그림을 그려주는 부분(리렌더링) 모두 자동 화면이 그려질때 요청이가고 , data로 받아오고 자동으로 그 데이터를 가지고 화면에 그리게 된

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

23일) 브라우저에도 저장공간이 있대!.. localStorage/Next.js 렌더링의 Diffing / Hydration/권한분기/Closure/HOC / HOF code camp fe 6기

'어려움' 문제를 내가 스스로 생각해서 처음 맞췄다!!!!!!!!!!!!!!!오늘 등원할때 궁둥이에 찝찝한게 묻어서 기분이 안좋았었는데 문제 잘푸려고 그랬나보다. 너무너무 행복하다 ! 알고리즘 풀이접근법을 잘 몰랐던 내가 이렇게 발전할 수 있는 이유는1.RunJS를 켜

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