고양이와 코딩

자기소개서 페이지 작성 중 중복되는 부분이 너무 많아서 중복부분을 컴포넌트화 해서 가져다 쓰면서 props로 전달받은 Description이 가독성 떨어지게도 한줄로 줄줄 쓰여지는 것이다.. globals.css에 white-space: pre-line; 도 줘 봤지만 안되고.. 다른 블로그를 보고 replace를 사용해서 써 볼까 생각도 해봤지만.. 다들 그렇지 않은가영 내키지가 않았다. 게다가 tailwindCSS를 사용하니 배로 헷갈려서!! 삽질만 엄청나게 하다가 이렇게 해결했다 ㅎㅎ ✨해결 .timeline-description { white-space: pre-line; } globals.css에 css를 작성 해 주고 import React from "react"; import { FontAw..

실행하면 흰 화면만 나왔을 때의 코드, 개발자 도구에서 확인해보니 이런 오류가 잔뜩 떴다! import {BrowserRouter as Router, Routes, Route } from "react-router-dom"; BrowerRouter as Router 을 추가해주고 로 감싸줬더니 정상적으로 나왔다 ㅎㅎ

유데미 강의를 듣다가 양방향 바인딩에 대해서 배웠는데, 실습에서는 쉬워보이는 척..(아마도) 했지만 그래도 양방향 바인딩이라는 용어에 대해 제대로 짚고 넘어가고 싶어서 하는 포스팅이다 ! 리액트는 기본적으로 단방향 바인딩 을 한다. 부모 -> 자식 컴포넌트로 하향식으로 데이터를 전달하는데, 이때 자식이 부모 컴포넌트의 state를 변경하고 싶다면! 간단히 말해 변경되는 입력값만 수신하는 것이 아니라, 입력에 새로운 값을 다시 전달하고싶다면, 양방향 바인딩을 이용하면 된다. Title Amount Date Add Expense 내가 실습한 코드는 기본 input 요소에 value를 추가 해서 새로운 입력 요소를 submit 했을 때 다시 빈 문자열로 초기화 하는 방법을 사용했다. 이렇게 하면 입력받은 값을..

react 공부중 최대 난관 봉착... 원래도 빠르게 이해를 하는 편은 아니지만 온갖 강의와 설명을 듣고도 어쩐지 useState가 이해가 안되서 엄청나게 좌절... 울진 않음..아직 ㅎㅎ 그래도 어떡해 하긴 해야되는데 라는 마음으로 유튜브 "코딩애플" 님의 React 강의를 듣게 되었다! 당연히 여러 강의를 들을수록 경험치가 쌓이는 느낌이었는데, 코딩애플님의 강의는 컴포넌트를 이것저것 만들지 않고 정말! 간단명료하게 설명해 주셔서 기존에 10씩 쌓이던 경험치가 한 30정도씩 쌓이는 기분이었다. 중간중간 주시는 숙제도 다른 강의에서는 코드 한줄도 못 짰었는데, 이 강의에서만큼은 어째저째 성공할수 있었다 !!! 뿌듯 ദ്ദി ᵔ∇ᵔ ) 아무튼 기껏 이해한거 까먹을까봐 포스팅 해놓으려고 한다. /* esli..