react6 [React] useEffect로 api 받아와서 렌더링하기 useEffect를 사용하면 입맛에 맞게 렌더링을 할 수 있다고 해서 사용했다. 그런데 api 비동기 요청 후 state 변경하는 과정에서 오류가 난다😥 대충 이런 식으로 코드를 작성했다. App = () => { var [data, setData] = useState({}); async function fetch1() { data["1"] = await fetchApi1(); } async function fetch2() { // fetch1 과 동일 } async function fetch3() { // fetch1 과 동일 } function getData() { fetch1(); fetch2(); fetch3(); } useEffect( ()=> { getData(); },[]); return (.. 2023. 7. 2. [React] destroy is not a function 에러 destroy is not a function useEffect가 함수가 아닌 값을 반환하거나 비동기 함수를 콜백하는 경우 발생한다. 2023. 7. 1. [React] 라이브러리 오픈소스가 많다 컴포넌트 하나하나 언제 구현하나 머리 빠개고 있는데 찾아보니 라이브러리가 엄청 많네? 부트스트랩 정도랑 통계, 그래프류는 있을 거라고 예상했는데 귀엽고 깔끔한 디자인된 컴포넌트까지...!! 갑자기 프론트 개발이 재밌어진다🤭 리액트만 알다가 플러터를 알았을 때의 새로움*1000 정도의 느낌을 받았다!!!!!!! 디자인, CSS로 고통받는 거 때문에 프론트 재미 없던 건데 미쵸따 귀여운 거 좋아 TOAST UI :: Make Your Web Delicious! TOAST UI is an open-source JavaScript UI library maintained by NHN Cloud. ui.toast.com MUI: The React component library you always wanted MU.. 2023. 6. 24. 3. Re:제로부터 시작하는 프론트엔드 생활 안녕하십니까 드디어 개발이 시작됐습니다. 이런저런 이유로 백이 아닌 프론트를 맡게 됐습니다. 좌충우돌 우당탕탕 리액트 개발기가 될 것 같습니다. 왜냐면 지금 input 박스조차 못 만들고 있기 때문이죠. 후후... JS 문법조차 몰라서 정말 zero부터 시작합니다. 개인 프로젝트야 유야무야 나만 알아볼 수 있게 해도 됐는데 팀플인만큼^^.. 깔끔하게 개발해 보겠습니다. 2023. 6. 21. Docker로 React, Nginx, Spring Boot 컨테이너 배포하기 이전까진 도커 캐싱이 뭔지 모르고 어영부영 Dockerfile 작성하면서 살았다. 예에에에에에에전에 도커를 처음 사용해 프로젝트 진행했을 때 컴퓨터 수명 다 깎아 먹었었다. 코드 수정이 있을 때마다 이미지 재생성을 위한 빌드를 계속했기 때문에 (한 번 빌드 시 20분 씩 걸렸던 기억이다....) 프로젝트 구조는 대충 이렇게 생겼다. ├─docker-compose.yml ├─backend │ ├─Dockerfile │ ├─build │ └─src └─frontend ├─Dockerfile ├─nginx.conf ├─build └─src Spring Boot Dockerfile 그레이들 코틀린 버전이라 kts 확장자로 작성했는데 순수 그레이들이면 .kts를 삭제하면 된다. FROM openjdk:11 AS .. 2023. 6. 9. [서평/23-9] Do it! 클론코딩 영화 평점 웹서비스 독서기간_2023년 1월 11일 ~ 2023년 1월 14일 저자_니꼴라스 출간일_2021년 React 학습을 위해 두잇 시리즈(클론코딩)와 생활코딩 시리즈(React 기술 위주) 중에 어떤 게 좋을까 하다가 아무래도 클론코딩이 실습에 바로 적용할 수 있을 것이라 판단했다. 그렇다고 React 기술 설명이 뒤쳐지지 않아보였다! 그리고 외부 API를 끌어다 쓰는 실습도 있고! 서버를 구현하지 않는다!!! 나는 배치, CSS 위주의 공부가 필요하다고 생각했기에 이 부분이 제일 큰 장점으로 느껴졌다. axios로 get API로 Json 데이터를 가져와 화면에 배치하는 것이 책의 목표이다. CSS 적용이 책 내용의 1/3을 차지하는 것 같지만 그만큼 중요하다는 뜻이겠지~ 코드 내 배열 데이터를 이용하지 않고 a.. 2023. 1. 21. 이전 1 다음
