즐겁게, 코드

널 병합 연산자(nullish coalescing operator)는 null 또는 undefined 값을 처리하기 위해 ES6에서 새롭게 등장한 문법입니다. 사용 방법 // ??을 기준으로 왼쪽 값이 null 또는 undefined라면 오른쪽 값이 대신 할당됩니다. const value = null ?? "Default value"; 널 병합 연산자를 사용하면 변수에 대입되는 값이 null 또는 undefined일 경우에 대신 대입할 값을 지정할 수 있습니다. (※ 리액트를 경험해보신 분들이라면, 리액트의 defaultProps 와 동일한 역할을 한다고 생각하시면 편합니다!) 널 병합 연산자를 사용하지 않을 때를 예로 들어 보겠습니다. let student = null; setTimeout(() => ..

🛠 내용 : react-globe.gl 라이브러리를 사용할 때, 한글 라밸이 깨지는 문제 WebGL 기반 3D 지구를 모델링할 수 있는 vasturiano 님의 react-globe.gl 라이브러리를 사용하던 중, 큰 문제가 생겼습니다. vasturiano/react-globe.gl React component for Globe Data Visualization using ThreeJS/WebGL - vasturiano/react-globe.gl github.com 다름이 아니라 이렇게 한국어 라벨을 사용하면 문자를 인식하지 못하고 "??" 라는 기호로 치환되는 문제였는데요, 문제의 원인이 도저히 감이 오지 않아 어쩔 줄을 몰라하고 있었습니다. 😂 📪 이슈를 남깁시다 아무튼 이렇게 이슈를 남기고 답변을 ..

🏒 들어가기 전에 이 글은 Mark Longair 님의 GIT: FETCH AND MERGE, DON’T PULL 을 읽고 번역한 글입니다. ※ 매끄러운 번역을 위한 의역이 다소 있으며, 혹시 잘못된 번역이나 어색한 문장 지적은 감사히 받겠습니다. 😄 2020 오픈소스 컨트리뷰톤 당시 멘토님께서는 원격 저장소에서 커밋을 불러올 때 git fetch와 rebase를 활용했는데, 저로서는 git pull을 두고 왜 어려운 방식을 사용하는 건지 이해되지 않았던 때가 있었습니다. 이번 글을 번역하면서 git fetch와 pull의 차이를 정리해보고자 합니다. (요약 : git pull은 변경사항을 페칭한 후 곧바로 병합하지만, git fetch는 페칭과 병합 프로세스를 분리할 수 있기 때문입니다.) 제가 주변 ..

📝 내용 : Netlify 배포 시, Treating warnings as errors because... 에러로 인한 배포 실패 제작한 페이지를 Netlify에 간단하게 배포해보려 했는데, 어흑 마이 깟... 😂 간만에 사용해서 그런지 뭔가 잘 되지 않는 모습입니다. 로그를 읽어보니 경고를 에러로 인식하는 문제같은데, 생각보다 간단하게 해결할 수 있는 문제였습니다. 먼저 배포 탭의 최상단 Deploy settings(배포 설정)으로 들어갑니다. 이후 Build & deploy 탭의 Continuous Deployment 항목을 클릭하면 빌드 명령어를 지정할 수 있는데, npm run build 를 CI=false npm run build 로 고쳐줍니다. 그럼 사이트가 성공적으로 배포된 것을 확인할 수 ..

[백준 온라인 저지 링크] 2583번: 영역 구하기 첫째 줄에 M과 N, 그리고 K가 빈칸을 사이에 두고 차례로 주어진다. M, N, K는 모두 100 이하의 자연수이다. 둘째 줄부터 K개의 줄에는 한 줄에 하나씩 직사각형의 왼쪽 아래 꼭짓점의 x, y좌표값과 오 www.acmicpc.net 입력이 약간 마음에 들지 않는 문제였습니다! 첫째 줄에서 M, N을 입력받아 무의식적으로 M = 행, N = 열인줄 알았지만, 실제 풀이에서는 N = 행, M = 열로 바꿔 풀어야 했네요 ㅡㅡ! 이외에는 2667번 단지번호붙이기, 1012번 유기농 배추 등의 문제와 동일한 방법으로 해결할 수 있는 문제였습니다. [정답 코드 - Python] from collections import deque M, N, K = ma..

토스의 첫 개발 컨퍼런스, SLASH21이 막을 올렸습니다! 저는 이런 컨퍼런스 홍보 페이지를 보면 항상 개발자 도구에 먼저 손이 가곤 하는데, 이번에는 특이하게도 페이지가 리액트로 제작되어 있어 컴포넌트를 구경하던 중 처음 보는 forwardRef 성분에 대해 궁금증을 갖게 되었습니다. 🤔 🛠 HTML 노드를 커스텀 컴포넌트로 교체하기 import { useEffect, useRef } from "react"; import Input from "./components/Input"; function App() { const nameRef = useRef(null); const submitRef = useRef(null); useEffect(() => { alert("페이지 로딩됨"); nameRef.cu..

이전 글에서 Geth라는 CLI 기반 소프트웨어를 통해 프라이빗 블록체인을 배포해 보았습니다. Geth를 활용한 프라이빗 블록체인 구축 & 마이닝 실습 Geth(Go + Etherium)는 이더리움 기반 블록체인 네트워크를 구성하기 위한 클라이언트 소프트웨어인데요, 오늘은 Geth를 활용해 이더리움 기반 블록체인을 구성하고 블록을 직접 마이닝해 이더를 획 merrily-code.tistory.com 그런데 사실 복잡한 세팅과 명령어로 인해 Geth를 활용하는 방법이 쉽지는 않습니다.. 😂 오늘은 Ganache(가나슈) 라는 툴을 활용해 프라이빗 블록체인을 구축한 다음, 보다 쉽게 스마트 컨트랙트를 배포해보겠습니다! Ganache 사용법 가나슈는 가나슈 공식 홈페이지에서 간단하게 설치할 수 있습니다. Ga..