본문 바로가기
반응형

개발24

CSS와 JavaScript에서 문자열 줄 바꿈 구현하는 방법 줄 바꿈은 텍스트를 읽기 쉽게 만들고, 데이터를 구분하며, 출력 형식을 제어하는 데 중요한 역할을 합니다. 이 글에서는 CSS와 JavaScript에서 줄 바꿈을 구현하는 다양한 방법을 자세히 설명하겠습니다. CSS에서 줄 바꿈CSS는 웹 페이지의 스타일을 정의하는 데 사용되며, 줄 바꿈을 제어하는 여러 속성을 제공합니다.1. white-space 속성white-space 속성은 요소 내에서 공백과 줄 바꿈을 어떻게 처리할지를 결정합니다.normal: 연속된 공백은 하나의 공백으로 간주되고, 줄 바꿈은 무시됩니다.nowrap: 텍스트는 줄 바꿈 없이 한 줄로 표시됩니다.pre: HTML에서 작성된 공백과 줄 바꿈이 그대로 유지됩니다.pre-wrap: 공백과 줄 바꿈이 유지되지만, 긴 줄은 필요한 경우 줄.. 2024. 6. 21.
Git 명령어 총정리: 알아두면 유용한 Git 명령어 가이드 Git은 소스 코드 관리를 위한 분산 버전 관리 시스템으로, 많은 개발자들이 협업 프로젝트에서 사용하고 있습니다.저도 맨날 필요할때 마다 구글링이나 gpt 한테 물어보는 기억할겸 정리하려고 글을 씁니다 ㅋㅋㅋ이 글에서는 자주 사용하는 Git 명령어를 보다 자세히 정리하여 소개하겠습니다. 이 명령어들을 익히면 Git을 보다 효율적으로 사용할 수 있습니다. 1. Git 초기화 및 클론git init현재 디렉토리를 새로운 Git 저장소로 초기화합니다.git init git clone원격 저장소를 로컬 디렉토리에 복제합니다.git clone  2. 상태 확인 및 변경 사항 관리git status작업 디렉토리의 상태를 확인합니다. 변경된 파일, 스테이징된 파일, 추적되지 않은 파일 등을 보여줍니다.git stat.. 2024. 6. 21.
사내 칸반보드 개발 프로젝트 - 5 사내 칸반보드 개발 프로젝트 - 4사내 칸반보드 개발 프로젝트 -3스타트업 프론트개발자의 칸반보드  풀스택개발기 사내 칸반보드 개발 프로젝트 -22024.05.15 - [개발] - 사내 칸반보드 개발 프로젝트 -1포부를 밝혔던 1편에이어sancho216.tistory.com 오늘 글은 드디어 백엔드로 넘어왔다.사실 지금 회사를 입사하고 초기에 강의를 들었을 때 node js가 포함되어 있어 들은 이후로 한적이 없으니 거의 3년만에 다시 해본것이다.이번에 신기한데 3년 전에 했을 때는 코드가 아예 눈에 안들어왔는데 이번에는 신기하게 쓱 보는데 코드를 조금 이해 할 수 있었다.확실히 포기 안하고 꾸준히 하면 성장이란 것을 할 수 있는 것 같긴하다. 기술 스택1. Node.js2. mongoDB (회사에서 사.. 2024. 5. 26.
사내 칸반보드 개발 프로젝트 - 4 사내 칸반보드 개발 프로젝트 -3스타트업 프론트개발자의 칸반보드  풀스택개발기 사내 칸반보드 개발 프로젝트 -22024.05.15 - [개발] - 사내 칸반보드 개발 프로젝트 -1포부를 밝혔던 1편에이어 이제 진짜 코드가 들어가는 2편이sancho216.tistory.com스타트업 프론트개발자의 칸반보드  풀스택개발기드디어 첫 백엔드 개발이 시작되서 걱정반 설렘반입니다.역시 node js api 서버 개발 검색하니 무수히 많은 예제가 나와서 어렵지 않았습니다. 나는 프레임 워크 express를 선택했다.먼저 간단하게 express에 대해서 설명을하자면Express.js는 Node.js를 위한 간결하고 유연한 웹 애플리케이션 프레임워크입니다. Express는 Node.js 애플리케이션의 서버 측 로직을 구.. 2024. 5. 22.
사내 칸반보드 개발 프로젝트 -3 스타트업 프론트개발자의 칸반보드  풀스택개발기 사내 칸반보드 개발 프로젝트 -22024.05.15 - [개발] - 사내 칸반보드 개발 프로젝트 -1포부를 밝혔던 1편에이어 이제 진짜 코드가 들어가는 2편이 시작된다.빠르게 설명부터 들어가자 칸반보드의 핵심의 첫번째는 바로 드래그앤sancho216.tistory.com 오늘은 칸반보드의 글을 작성하는 글을 넣어본다 !!그래서 editor를 찾아보았는데 제일 많이 사용하는 에디터인 React-Quill 를 선택했다.내가 사용해보기도 만족도가 높았던 에디터였다.  react-quillThe Quill rich-text editor as a React component.. Latest version: 2.0.0, last published: 2 years ago.. 2024. 5. 22.
사내 칸반보드 개발 프로젝트 -2 2024.05.15 - [개발] - 사내 칸반보드 개발 프로젝트 -1포부를 밝혔던 1편에이어 이제 진짜 코드가 들어가는 2편이 시작된다.빠르게 설명부터 들어가자 칸반보드의 핵심의 첫번째는 바로 드래그앤 드롭 기능 구현이다.구글링 해보니 대부분 라이브러리 react-beautiful-dnd 를 사용해서 구현하고 있었다.나는 라이브러리를 사용하기 보다 직접 구현하고 싶어 사용하지 않기로 했다.나에게는 chat gpt가 있으니 말이다.코드를 보여주기전에 나의 스택을 나열하면 1. react2. tailwind3. style-components를 사용했다. css 라이브러리를 특이하게 두개나 사용하는데 taillwind 는 보통 엘레멘트 css 용도로 사용하고 스타일 컴포넌트는 컴포넌트를 만들때 주로 사용한다... 2024. 5. 16.
반응형