AngelPlayer`s Diary

[TIL] 20240206 개발일지

알고리즘 강의 boj 10819 차이를 최대로 단순 순열 문제 boj 15686 치킨 배달 일단 순열로 풀었는데 시간초과나는걸 어거지로 pypy를 통해 성공시켰다. 다음 주에 다시 풀어봐야 할 듯 Front-End textarea 개행 출력되지 않는 문제 textarea에 글을 개행으로 작성하고 나서 데이터를 DB에 넣고 다시 출력하려고 하면 정상적으로 출력되지 않는 문제가 발생하였다. 뭔가 저장 도중에 개행이 날아가는 문제가 발생하는 것 같아서 작성할 방법을 모색하였다. 결국 1) 개행한 부분을 강제로 \n로 치환 2) 받아온 데이터에서 \n 부분을 잘라서 출력 과 같은 방법을 통해 해결하였다. 자세한 해결 방법은 아래에 정리하였다. https://angelplayer.tistory.com/535 기타
일상/개발 일지 2024. 2. 7. 00:36

[HTML/CSS] textarea 개행 안되는 문제 해결 (Feat. React)

(※ 저는 React와 Firebase를 사용하는 도중 문제가 발생하였습니다.) 태그를 사용하여 1)글을 작성 한 후, 2)DB에 저장하고, 3)출력을 했더니, 개행(Enter)이 모두 띄워쓰기(Space)로 치환되어 출력되는 현상이 발생하였습니다. 인터넷에서 유사한 문제가 발생한 사람들이 몇몇 있었으나 /n으로 저장이 되고 제대로 출력되지 않는 현상이었고, 저는 DB에 띄워쓰기로만 저장되는 상태였습니다. (※ 문제를 해결한 사람들 중에 "white-space: pre-wrap;를 통해서 해결하였다"는 분들도 계셨으나, 일단 저는 해당 방법으로 해결되지 않았습니다.) const formattedDescription = item.description.replace(/\r?\n/g, '\\n'); texta..
Web/HTML&CSS 2024. 2. 6. 09:35

[TIL] 20240201 개발일지

알고리즘 파이썬으로 변경하고 처음 알고리즘 문제를 풀었다. 일단 N과 M 시리즈를 풀면서 순조부를 복습하였다. 코드가 간결해지는 느낌은 있는 것 같는데 우선 나만의 스타일을 찾아서 계속 코딩하는 것이 중요할 것 같다. -> 일단은 main()과 global을 적극 활용하는 포지션으로 준비 중인데 프로그래머스로 코드를 작성해봐야 알 것 같다. 그리고 자꾸 if문과 for문 뒤에 무의식적으로 ()를 붙이고 있어서 힘들다. Front-End 오늘로 결제를 제외한 나머지 부분에 대해서 간단히 개발을 끝마쳤다. 서비스 테스트를 위해서 netlify를 이용해서 배포를 진행해보았다. 다른 친구와 함께 서비스를 테스트 하는 과정에서 나타나는 버그나 에러 등에 대해서 찾았는데 상당히 고칠게 많아 보인다. 그리고 미구현한..
일상/개발 일지 2024. 2. 1. 23:57

[Three.js] Three.js 설치 및 기본 사용법

Three.js는 기존의 web에서 3D 객체를 띄우기 위한 라이브러리인 WebGL의 불편함을 개선하고 직관적인 코드를 작성할 수 있도록 만들어진 JS 라이브러리입니다. 1. Three.js 다운로드 https://threejs.org/ Three.js – JavaScript 3D Library threejs.org Three.js를 사용하기 위해서는 우선 다운로드가 필요합니다. 위 링크로 들어가셔서 Code - Download를 통해 파일을 다운로드합니다. 다운로드 받은 파일을 압축을 푼 후 사용하시면 됩니다. 압축을 풀었을 때 라이브러리 파일이 나타나는 위치를 기반으로 파일을 작성하시면 됩니다. 2. Three의 기본 요소 Scene : 3차원 객체로 구성되는 장면 Render : Scene을 출력장..
Web/etc 2023. 9. 9. 09:27

[Vue.js] 디렉티브 코드 사용법 정리 (v-* 속성)

텍스트 보간 (string interpolation) 텍스트 보간이란 글자를 동적으로 치환하여 보여주기 위한 방법입니다. vue에서는 머스태치 ( {{ }} ) 문법을 통하여 텍스트 보간을 할 수 있습니다. ex) {{msg}} 머스태치는 동적으로 데이터가 바뀌면 실시간으로 수정된 값이 적용됩니다. 만약 수정이 되는 것을 원치 않는다면 v-once 디렉티브를 사용해야 합니다. {{msg}} 디렉티브 코드 디렉티브 코드란 v-접두어를 가진 태그 속성을 의미합니다. 크게 v-once, v-bind, v-model, v-on, v-if, v-for, v-cloak 등이 있습니다. v-once v-once는 머스태치를 통한 데이터 출력 시, 데이터가 동적으로 바뀌는 경우 처음 데이터를 그대로 유지하기 위해서 사..
Web/Vue.js 2023. 6. 30. 12:04

[JavaScript] for in / for of / foreach 사용법 비교 정리

for in 반복 수행을 위해서 사용합니다. for in의 경우 열거가 가능한 모든 객체(Array, Object, Map, Set, ...)에 대해서 반복 작업 수행이 가능합니다. const arr = ['Angel', 'Player', 'tistory']; const obj = { a: 'apple', b: 'banana', c: 'carrot', }; const str = 'Angel'; // 객체 for in for (let i in obj) { console.log(i); } console.log('-------'); // 배열 for in for (let i in arr) { console.log(i); } console.log('-------'); // 문자열 for in for (let i..
Programming 2023. 5. 8. 08:33

[JS] for, for in, for of 반복문 사용법 및 차이점

자바스크립트(JavaScript)는 for 문으로 기본형인 for 반복문 이외에도 for in 문과 for of 문을 사용할 수 있습니다. 1. for 문 우선 for 문입니다. for (초기값; 조건식; 증감식) { ... } for 문은 다른 일반적인 언어들과 유사하게 초기값, 조건식, 증감식 형태로 사용합니다. 뒤에서 살펴볼 for in 문이나 for of 문과 다르게 for 문의 경우 반복을 제어할 변수를 let으로 지정을 해줘야 한다는 점을 유의하셔야 합니다..! for (let i = 0; i < 3; i++) { console.log(`${i}번 반복하였습니다.`); } 2. for in 문 for (const item in 배열 or 객체) { ... } for in 문은 파이썬의 for ..
Web/JS&TS 2021. 1. 7. 10:13

[JS] 템플릿 문자열(Template String) 사용법

자바스크립트(JavaScript)에서 우리가 변수를 가지고 있고, 그것을 활용하여 문장을 만들어 출력한다고 가정해봅시다. const a = 'apple'; const b = 'banana'; 위와 같이 변수가 있고, 이것을 출력하기 위해서는 const output = 'output : I like ' + a + ' and ' + b +'...!'; console.log(output); 지금까지 이런 형태로 작성을 해왔을 것입니다. 이러한 코드의 단점으로는 계속 따옴표(' or ")와 더하기 연산자(+)를 작성해야하고, 띄워쓰기를 따로 신경써줘야 한다는 번거로움이 있었습니다. 하지만 ECMAScript의 업데이트로 아래와 같은 코드를 사용할 수 있게 되었습니다. const output2 = `output ..
Web/JS&TS 2021. 1. 6. 09:06

[JS] 자바스크립트 코딩 컨벤션 (Naver, Airbnb, standardJS)

새로운 언어에 대한 공부를 시작할 때 개인적으로 규칙에 많이 얽매이는 것 같습니다. 변수 이름 선언이나 들여쓰기 규칙 등은 실행함에 있어서 큰 문제는 없지만, 아무래도 코드를 만들어 놓고 일정한 규칙이 없으면 보기도 불편하고 무엇보다 이쁘지가 않으니까요. 또한 깃허브 등에 코드를 업로드하거나 업로드 된 자료를 볼 때 다른 사람이 한눈에 쉽게 이해할 수 있도록 작성 되는 것이 아무래도 더 나은 코드라고 할 수 있을 것입니다. 이러한 이유로 '코드는 이렇게 쓰자!'라는 약속을 정하기 위해 생긴 것을 코딩 스타일(Coding Style), 혹은 코딩 컨벤션(Coding Convention)이라고 합니다. 오늘은 자바스크립트(JavaScript) 코딩 컨벤션을 가지고 있는 에어비엔비, 네이버, 그리고 stand..
Web/JS&TS 2021. 1. 5. 13:24
◀ 1 ▶

티스토리툴바