요새 또 블로그를 게을리하고 있었는데 다시 차근차근 써보도록 하겠습니다. 기본기가 많이 없어서 한동안은 React의 기본적인 Hook 이나 메서드 같은 걸 공부하도록 하겠습니다.일반적으로 함수형 컴포넌트 내부에서 발생하는 side effect를 처리할 때 React 모
변명 중에서도 가장 어리석고 못난 변명은 "시간이 없어서"라는 변명이다. -에디슨- 잠깐의 2021년 회고 블로그를 작성하기전에 현재의 내가 느끼고 있는 것들의 대해서 잠시 얘기를 해보겠다. 나는 2달전에 부트캠프를 들어와서 현재 기업협업을 나와있다. 부트캠프에 다
기업협업에서 백엔드와 API통신을 하던 중 에러를 마주하게 됐는데...현재 프론트엔드, 백엔드를 분리하여 프로젝트를 진행하던 중 둘 다 로컬서버로 run server를 하였는데이러한 에러가 뜨면서 진행이 안되는 일이 발생하였다. 많은 검색을 해본 결과 이것이 CORS
"내 자신에 대한 자신감을 잃으면, 온 세상이 나의 적이 된다." -랄프 왈도 에머슨- 이번 프로젝트 회고도 좋은 명언으로 시작하겠습니다. 2차 프로젝트를 진행하면서 작업적으로도 힘들지만 정신적으로 힘들때가 있었습니다. 그때마다 이 명언을 보면서 견뎠던 기억이 납니다
프론트 마지막 세션데이터의 흐름이 복잡하기 때문에 데이터의 흐름을 제약할 필요가 생겼습니다.그래서 상태 변화가 일어나는 시점과 형태에 제약을 두어서 상태 변화를 예측 가능하게 만들고자 시도을 한 것입니다. 단방향 데이터 바인딩을 하는 Flux패턴의 자바스크립트 구현체
React로 페이지네이션을 라이브러리로 구현해보았습니다.많이 해매가지고 제가 어떻게 구현을 했는지 차근차근 써보겠습니다.1차 프로젝트때는 무한스크롤을 구현하였고 2차 프로젝트에서는 페이지네이션을 구현하게 되었습니다. 좋은 라이브러리가 많이 있었는데 그 중에서 react
React slick 을 이용하여 Carousel을 구현해보자!라이브러리를 사용하는데도 시간이 오래걸렸고 이것을 정리해서 올려봅니다.2차 프로젝트를 시작하면서 슬라이드(캐러셀)을 구현해야하는 일이 생겼고, 이것을 라이브러리로 적용해보자는 마음을 먹고 구현을 해보았습니다
React로 구현하게 된 카카오 소셜로그인에 대해서 작성해보도록하겠습니다.REST-API말고 자바스크립트 팝업로그인으로 구현하였습니다.저처럼 서성이는 분들께 도움이 되길 바라면서 작성해보았습니다.💻 사용한 것: React / style-component / kakao
스크롤바를 최상단으로 고정하기인디케이터란?일의 현황/사정 변화 등을 나타내는 지표를 말합니다. 스크롤을 하면 상단에 게이지가 쌓이면서 어느정도 스크롤링이 됐는지를 보여주는 것입니다. 라이브러리 없이 구현하기..!검색해서 여러가지를 보았지만 방법은 의외로 간단했습니다.s
프로젝트를 진행하면서 알게 된 무한스크롤을 되짚어보겠습니다.정보를 한번에 가져와서 보여주기엔 정보량이 너무 많아서 API fetch로 받는 결과가 느릴 때, 스크롤을 통해서 아주 작은 일부분만 가져와서 추가로 보여주는 기술을 말합니다.즉, Scroll End 지점까지
인내하라, 경험하라, 그리고 희망을 가져라 - 조셉 에디슨제가 좋아하는 명언으로 글의 시작을 알려보았습니다. 첫 프로젝트를 시작하고 마친 현재에 시점에서 저를 다시 돌아보게 하는 문장입니다.인내하고 경험하고 희망을 가지는 사람이 되기 위해 항상 감사하는 마음을 가지겠습
이번 프로젝트를 진행하면서 알게 된 것들을 작성합니다.fetch 파일은 하나의 useEffect에 적어도 됩니다. , 가 없으면 무한랜더링이 일어납니다.반드시 작성해야합니다.모든 함수는 return 안에 존재해야합니다.Component의 이름을 작성하고 useState
1차 프로젝트를 하면서 느낀점월요일부터 1차 프로젝트를 시작하였습니다. 저희팀은 작가로 선정된 사람들이 글을 올릴 수 있는 '브런치'라는 사이트를 클론코딩합니다.제가 맡은 부분은 포스팅페이지와 리스트페이지입니다. 상단바 / 헤더 / 본문 / 작가소개란 / 추천 글 리스
너무 바빠서 블로그 안쓴지 오래됐다. 힘내서 블로그 정리하기 React state 변경하는 법 onClick 이벤트 안에는 무조건 { 함수 } 만을 넣을 수 있습니다. onClick ={ 제목바꾸기() } 이건 함수를 바로 실행하라는 뜻입니다. 소괄호는 빼는 것이
오늘도 힘차게 리액트에 대해서 알아봅시다!변수를 { } 안에 넣으면 랜더링을 시킬 수 있습니다. 함수도 넣을 수 있습니다. src,id,href 등의 속성에도 {변수명,함수 등}, 상상하는 모든 곳에 { }로 변수 집어넣기가 가능합니다.style도 집어넣을 수 있는데,
이렇게 작성하니까 'key'가 없다는 오류가 떴다. 그래서 index를 만들어주고 key에 index 값을 적어주니 오류는 사라졌다. Key는 React가 어떤 항목을 변경하거나 추가 또는 삭제할 지 구분하는 것을 돕는다.Key는 element에 안정한 고유성을 부여하
💻 React에 대해서 다시 공부해봅시다.무언가를 나눈 파일 (폴더로 안해도 됨)function 컴포넌트만 쓸겁니다. function을 쓰면 무조건 return값을 써야합니다.그 안에는 JSX문법을 써야합니다. HTML 문법과는 다릅니다.위에 코드를 첫번째에 꼭 적어
오늘 구현한 것들을 마구잡이로 적어본다.아이디에 @가 들어가거나 비밀번호가 5개 이상일 경우 로그인 버튼이 활성화 되는 것을 구현하였습니다.무언가 비교할 때는 꼭 원래 값을 써야합니다. console.log를 자주 이용해야한다. 먼저 active, setActive 를