Thinking Developer

Next.js는 React.js를 개발할 때 SSR(Server Side Rendering)을 보다 쉽게 해주는 프레임워크 중 하나이다. React.js 실무 프로젝트에서 가장 많이 사용되는 프레임워크이며, 나 같은 경우엔 굳이 SSR이 꼭 필요한 상황이 아니더라도 라우팅 등이 편해서 React.js 프로젝트를 할 때는 Next.js 위에서 작업하는 것을 선호한다. 이 포스팅에서는 Next.js를 설치하고 TypeScript, ESlint, Prettier를 끼얹는 과정까지만 다룬다. React.js 및 Next.js 프로젝트에서는 위의 프레임워크, 라이브러리 외에도 Redux나 Styled-Components와 같은 패키지들을 주로 설치해서 쓰곤 하나 반드시 필요한 요소라고는 할 수 없다. TypeSc..

Java와 Kotlin 관련 내용은 나중에 Spring으로 백엔드를 구현할 때 포스팅하려 했는데, Private NPM을 위한 Nexus를 설치하려다가 JDK 설치 이슈를 만나서 이렇게 먼저 포스팅하게 됐다. 보통 Oracle의 JDK를 많이 쓰곤 하는데, 일반 유저 입장에서 JDK로 만들어진 프로그램을 돌리려고 Oracle JDK, JVM을 설치하는 것은 전혀 문제가 없지만 JDK 기반 프로그램을 개발하는 입장에서는 라이선스 이슈가 신경이 쓰일 수밖에 없다. 물론 개인 프로젝트나 회사에서 내부적으로만 쓰는 거면 별 상관이 없다고는 하지만 뭔가 불안하다. 그래서 Open JDK를 많이들 설치하곤 한다. 나도 Open JDK를 설치하려고 이것저것 찾아보았는데 잘 되지 않았다. 일단 Home brew 설치가..

짜파구리라고 들어봤는가. 농심의 짜파게티와 너구리를 같이 끓여서 짜파게티 스프와 너구리 스프를 섞어서 비벼먹는 거 말이다. 아마 영화 기생충에서 채끝 짜파구리가 등장한 이후 인기가 많아지면서 엄청나게 유명해졌다. 근데 내가 새로운 짜파게티 레시피를 발견했다. 일부러 레시피를 생각해서 만든건 아니고 냉장고에 있는 거 그냥 섞었는데 너무 맛있다. 냉장고에 있던 건 바로 아래에 있는 도드람에서 나온 "참숯에 구운 직화곱창"이다!! 그냥 짜파게티 2개 끓여서 물을 적당히 버린 후에 스프 넣고 곱창 저거 넣어서 불 올리고 볶아주면 된다. 나는 별도의 냄비에 곱창을 볶은 다음에 짜파게티 냄비에 옮겨 담아서 다시 볶아줬었는데 굳이 그럴 필요는 없다. 운 좋게 이 글을 보는 분들은 꼭 한 번 해 먹어 보길 바란다. 아..

실무에서는 레거시 프로젝트도 있어서 node 버전 관리 프로그램을 따로 쓰기도 하지만 개인 컴퓨터는 굳이 그럴 필요까진 없고 그냥 LTS 버전만 써도 별 문제가 없다. 근데 LTS버전도 아예 새롭게 바뀌는 경우도 있고 마이너 업데이트가 되는 경우가 있다. 그래서 개인 컴퓨터에서도 가끔은 업데이트를 해주는 게 좋다. 참고로 내 개인 컴퓨터 환경은 macOS Big Sur 11.3, M1 칩셋이며 이 환경에서 진행을 했다. $ node -v $ npm -v 버전을 찍어보니 node는 14.16.0, npm은 7.10.0이었다. 다운로드 | Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org nod..

JavaScript Array의 반복 관련 메서드 두 번째 포스트다. 첫 번째 포스트는 다음을 참고 바란다. Array의 반복 관련 메소드(1) forEach, map, reduce 등 javascript에서의 반복 관련 메소드가 있는데, 그냥 편하게 반복문이라고도 하지만 정확히는 Array 객체의 메소드이다. 다만 for문 등 반복문과 비교가 되어 반복문으로 분류하기 think-dev.tistory.com 첫 번째 포스트에서는 forEach, map, filter, find를 다뤘다. 위 메소드들은 실무에서 많이 쓰지만 reduce하나면 거의 커버가 가능하고, 추가적인 형태로도 구현이 가능하다. 물론 reduce 역시 별도로 break문은 없어서 find를 구현하긴 어렵지만 시간 복잡도를 생각하지 않는..

짧다면 짧고 길다면 긴 구직활동이 끝나 이제 다음 주에 다시 직장생활을 하게 됐다. 여기저기 열심히 지원한 곳은 떨어지거나 합격해도 처우협상이 잘 안됐고, 별도로 회사에서 직접 제안이 온 곳에서 잘 협상이 돼서 입사하게 됐다. 아직 입사 전이지만 HR에서 각종 서류, 원하는 사무용 장비, 사원증용 정보, 명함용 정보 등을 제공하라고 안내받았고 아마 오늘 중으로 회사 생활에 대한 2차 안내가 올 것이다. 나름 대기업 계열사라 입사 전부터 체계적이고 느낌이 좋다. 내 포지션은 웹 프론트엔드 개발, 계속 자바스크립트 개발자로 일하게 돼서 기쁘다. 새로운 일상으로 들어가서 설렌다.

현재까지 느낀 점을 두서없이 적는다. 나는 JavaScript 개발자다. 그런데 다른 사람들은 풀스택 개발자라고들 많이 한다. 어쩌다 보니 iOS, Andorid, BackEnd, Web FrontEnd 모두 경험하게 되어 그렇다. iOS, Android는 보고 이해할 수 있고 하라면 또 할 수 있고 상당히 흥미로운 개발이지만, 음... 이젠 손 놓은 지 너무 오래됐다. 개인적으로 선호하는 직무는 Web FrontEnd 개발이다. 내 모든 경력에 JavaScript가 있기도 하고, 2010년대부터 뜨고 있는 FrontEnd Framework가 너무 맘에 든다. 또한 지속적으로 그 기술도 발전하고 있는데 그것도 흥미롭고 항상 도전할 수 있는 기회가 있다는 것이 맘에 든다. 이제 구직활동을 한 지 보름이 넘..

forEach, map, reduce 등 javascript에서의 반복 관련 메서드가 있는데, 그냥 편하게 반복문이라고도 하지만 정확히는 Array 객체의 메서드이다. 다만 for문 등 반복문과 비교가 되어 반복문으로 분류하기도 하지만 뭐 이렇든 저렇든 상관은 없다. forEach const ary = [1, 2, 3, 4, 5]; ary.forEach((e) => { console.log(e); // 1, 2, 3, 4, 5 }); // 이렇게 람다식으로 써도 된다. ary.forEach(e => { console.log(e); // 1, 2, 3, 4, 5 }); // 두 번째 인자는 Array의 index를 의미한다. ary.forEach((e, i) = > { console.log(e); // 1..

기본 while문, break문, continue문 let i = 0; while (i 5) { break; } } // continue let i = 0; while (i 5) { continue; } console.log("cn"); // cn, cn, cn, cn, cn } do ~ while문 let i = 0; do { console.log(i); //..

function solution(answers) { const human1 = [1, 2, 3, 4, 5]; const human2 = [2, 1, 2, 3, 2, 4, 2, 5]; const human3 = [3, 3, 1, 1, 2, 2, 4, 4, 5, 5]; let pointAry = Array(3).fill(0); answers.forEach((answer, index) => { const human1Index = useIndex(human1, index); const human2Index = useIndex(human2, index); const human3Index = useIndex(human3, index); if (human1[human1Index] === answer) { pointA..