리액트 2

[React] JSX에서 텍스트 줄바꿈 하는 방법

리액트 프로젝트를 진행하다보면 텍스트 태그를 사용할 일이 많은데요, 리액트에서 사용하는 JSX에서는 개행 문자 ('\n')이 적용되지 않습니다. 예를 들어 아래와 같이 작성해도 import React from 'react'; export default function Test() { return JSX에서 줄바꿈은 적용되지 않습니다. \n바로 이렇게요. } 개행문자가 그대로 텍스트로 출력된 것을 확인할 수 있습니다. 이를 해결하기 위해서 해결방법을 찾아보았는데, CSS에서 해당 태그에 white-space를 pre-line으로 설정해주면 된다고 합니다. 그러나 아무리 p 태그에 white-space: pre-line으로 설정해도 줄바꿈이 적용되지 않았는데요, 해결방법은 정말 간단했습니다. import R..

[React] "먹거리 기록" 리액트 프로젝트 개발환경 구축⭐️

안녕하세요! 최근 가장 기초라고 볼 수 있는 바닐라 자바스크립트에 대해 학습하고 있었는데요, 어느정도 DOM 요소를 가지고 놀 수 있게 되다보니 객체지향에 대해서도 큰 관심이 생겨 타입스크립트와 객체지향에 대한 강의를 수강했습니다. 👀 연습용 프로젝트도 하고 나니 생각보다 큰 장벽은 없다는 생각이 들었어요. 항상 타입스크립트가 중요하다, 한번 쓰면 헤어나오질 못하는 매력이 있다는 것을 말로만 들어 체감이 되지 않았어요. 그러나 실제로 사용해보니 협업 시에 매우 중요한 스킬이 될 것 같다는 느낌이 들었습니다. 굉장히 많은 타입과 객체지향 개념을 적용하는데 편리했고, 무엇보다 원하는 타입을 만들어 사용할 수 있다는 점이 가장 마음에 들었습니다. 타입스크립트를 사용하니 개발자를 풀어두는 듯한 자바스크립트보다 ..