본문 바로가기

전체 글83

리액트에서 줄바꿈 처리하는 방법 - CSS white-space 속성 쓰기 리액트에서 줄바꿈 처리하는 방법 - CSS `white-space` 속성 쓰기리액트로 개발하다 보면 텍스트 부분에서 줄바꿈이 제대로 안 돼서 열받잖슴?줄 바꿈 넣겠다고 \n넣고 해도 적용이 안됨...근데 해결법 간단함. 그거 `white-space` 속성 하나면 됨. 문제 상황 예를 들어, 우리 데이터가 이렇게 있다고 치자:const projectslist = [ { id: 1, type: "team", title: "GROW UP", description: "화면이나 캠을 공유하며 다른 사람과 함께 공부할 수 있는 웹 사이트입니다.", descriptionDetail: `GROWUP은 화면이나 캠을 공유하며 다른 사람과 함께 공부할 수 있는 웹 커뮤니티 사이트입니다.\n .. 2024. 5. 27.
[웹 포트폴리오 만들기] 5편 - next로 모달 라우팅 구현하기 2024.04.12 - [PROJECT] - [웹 포트폴리오 만들기] 1편 - 디자인 구상하기2024.04.23 - [PROJECT] - [웹 포트폴리오 만들기] 2편 - NEXT 로딩화면 구현하기2024.05.07 - [PROJECT] - [웹 포트폴리오 만들기] 3편 - 디자인 갈아엎기2024.05.08 - [PROJECT] - [웹 포트폴리오 만들기] 4편 - fullpage 구현하기2024.05.31 - [PROJECT] - [웹 포트폴리오 만들기] 6편 - 모바일 반응형 구현과 ..최종 완성Intercepting Routes와 Parallel Routes을 이용해서 모달창 만들기웹앱에서 모달창 만들 때 Intercepting Routes랑 Parallel Routes 쓰면 사용자 경험도 상승하고.. 2024. 5. 21.
[웹 포트폴리오 만들기] 4편 - fullpage 구현하기 2024.04.12 - [PROJECT] - [웹 포트폴리오 만들기] 1편 - 디자인 구상하기2024.04.23 - [PROJECT] - [웹 포트폴리오 만들기] 2편 - NEXT 로딩화면 구현하기2024.05.07 - [PROJECT] - [웹 포트폴리오 만들기] 3편 - 디자인 갈아엎기2024.05.21 - [PROJECT] - [웹 포트폴리오 만들기] 5편 - next로 모달 라우팅 구현하기2024.05.31 - [PROJECT] - [웹 포트폴리오 만들기] 6편 - 모바일 반응형 구현과 ..최종 완성 웹사이트를 스크롤할 때 섹션에 딱 맞게 스크롤 되는 기능을 fullpage, onepage라고 한다.이 기능을 포트폴리오 사이트에 구현하기 위해 내가 지나온 과정들을 써본다..(ㄹㅇ 삽질 엄청 함) .. 2024. 5. 20.
[웹 포트폴리오 만들기] 3편 - 디자인 갈아엎기 2024.04.12 - [PROJECT] - [웹 포트폴리오 만들기] 1편 - 디자인 구상하기2024.04.23 - [PROJECT] - [웹 포트폴리오 만들기] 2편 - NEXT 로딩화면 구현하기2024.05.08 - [PROJECT] - [웹 포트폴리오 만들기] 4편 - fullpage 구현하기2024.05.21 - [PROJECT] - [웹 포트폴리오 만들기] 5편 - next로 모달 라우팅 구현하기2024.05.31 - [PROJECT] - [웹 포트폴리오 만들기] 6편 - 모바일 반응형 구현과 ..최종 완성 순조롭게 포트폴리오 사이트 코드를 짜면서...대충 90퍼센트 정도 만든 후갑자기 그런 생각이 났다...다른 사람의 포트폴리오 사이트나그냥 일반적인 인터넷 사이트와 비교했을때 내가 만든 사이트.. 2024. 5. 7.

티스토리툴바