본문 바로가기

반응형

전체 글

(16)
[Javascript] 신입, 취준생을 위한 현업에서 코드 짜는법(클린코드) 이제 막 취업에 성공하신 분, 대학생 혹은 프로그래머로 취업을 준비중이신 분들은 현업에서 코드를 작성하는 방법에 대해서 궁금해 하시는 분들이 많으실 겁니다. 특히, 코드의 가독성은 신입이나 경력 상관없이 프로그래머라면 항상 관심을 가지는 주제인데요. 안그러면 다 지워집니다. 그만큼 프로그래머에게 있어서 가독성 좋은 코드를 작성하는 능력은 매우 중요합니다. 예제는 자바스크립트로 작성되었지만 파이썬, C++ 등 다른 언어에서도 통하는 방식입니다. 자바스크립트를 읽을 줄 아는 분이시라면 다른 언어에서도 활용해 보시길 바랍니다. 예제를 통해 가독성과 성능을 끌어올릴 수 있는 몇가지 상황을 알려드리겠습니다. 1. 조건문이 반복되는 if문의 경우 Array.includes를 활용하자 Bad Case if (data..
[Modern][Javascript] 체크박스 전체 선택 / 전체 해제 구현 Modern 시리즈는 작성일 기준 최신 자바스크립트 문법으로 구현한 예제입니다. 최신 문법으로 체크박스 전체 선택 / 전체 해제 구현하는 방법을 소개합니다. HTML 삽입 미리보기할 수 없는 소스 JS const checkAll = document.querySelector("[name=checkAll]"); const items = [...document.querySelectorAll("[name=items]")]; // 아이템 선택 이벤트 items.forEach(async (item) => { item.onchange = (e) => { checkAll.checked = items.every((item) => item.checked); } }); // 전체 선택 이벤트 checkAll.onchange..
[NodeJS] 자바스크립트도 between을 쓸 수 있다! 개발을 하다보면 비밀번호 길이 체크같은 유효성 검사나, 값의 범위를 검사하는 경우가 자주 생깁니다. 이런 코드를 작성하면 꽤나 장황한 문구로 생성되죠. if (value > start && value < end) // or if (start < value && value < end) SQL에서는 이러한 범위 값 판정을 between으로 해결합니다. SELECT * FROM some_table WHERE value BETWEEN 10 AND 20 만약 NodeJS에서 SQL의 between을 사용할 수 있다면 어떨까요? if (value in between(start, end)) 깔끔하고 명시적인 프로그래밍이 가능해집니다. 설치 between 라이브러리를 설치합니다. npm i @aierse/between..
[NestJS][Lambda][DynamoDB] Serverless 구성 + CI/CD 2023-01-15 일에 구동 확인했습니다. NestJS + Lambda + DynamoDB 환경 구성은 아래 글을 참고해주세요. [Serverless]NestJS + Lambda + DynamoDB 구성 + CI/CD CI/CD 내용이 필요하신 분은 다음 글을 참고하세요. 요즘 Serverless 아키텍쳐의 인기가 많아 NestJS + Lambda + DynamoDB를 활용해 환경을 구성해 보았는데요. 신기술이면서, 관련 정보도 많이 없어 환경 구 aierse.tistory.com Github Actions를 활용하여 CI, CD를 구축해보겠습니다. 환경 구성을 마치신 분은 AWS 콘솔측 권한설정까지 모두 마치셨을겁니다. 따라서 깃허브 측의 환경 변수만 세팅하고, actions 코드만 작성하면 CI, ..
[NestJS][Lambda][DynamoDB] Serverless 구성 CI/CD 내용이 필요하신 분은 다음 글을 참고하세요.  [NestJS][Lambda][DynamoDB] Serverless 구성 + CI/CD2023-01-15 일에 구동 확인했습니다. NestJS + Lambda + DynamoDB 환경 구성은 아래 글을 참고해주세요. [Serverless]NestJS + Lambda + DynamoDB 구성 + CI/CD CI/CD 내용이 필요하신 분은 다음 글을 참고하세요. 요즘 Serveaierse.tistory.com 요즘 Serverless 아키텍쳐의 인기가 많아 NestJS + Lambda + DynamoDB를 활용해 환경을 구성해 보았는데요.신기술이면서, 관련 정보도 많이 없어 환경 구성에 정말 애를 많이 먹었습니다. 특히 AWS 자체가 업데이트되며 과거..
리액트 프리랜서 체크리스트 출처(번역) Freelance React Developer Checklist 리액트 프리랜서로서, 저는 요즘 리액트 프로젝트에서 많은 고객들과 함께 일합니다. 이메일로 요청을 받을 때마다, 저는 보통 리액트 프리렌서 개발자 체크리스트 템플릿으로 답장합니다. 본질적으로 이 체크리스트는 리액트 프리랜서로서 프로젝트 참여를 더 원활하게 만듭니다. 왜냐하면 회사가 여러분을 고용하기 전에 양측의 요구 사항을 맞추기 위해 이 체크리스트를 통해 대화해야 하기 때문입니다. 이 글에서 체크리스트의 항목을 자세히 공유하겠습니다. 여려분이 직장을 찾는 구직자이든, 고용하려는 회사이든 상관없습니다. 리액트 프리랜서 체크리스트 프리랜서로서 회사와 일하기전에 항상 알고싶은 몇가지 세부사항이 있습니다. 이 프로젝트의 규칙이 뭔가요..
리액트 폴더 구조 설계 5단계 출처(번역) React Folder Structure in 5 Steps 대규모 리액트 어플리케이션의 폴더 및 파일 구조를 어떻게 설계하는가는 핫한 주제 중 하나입니다. 사람들이 소규모부터 대규모 프로젝트에 이르기까지, 저에게 리액트의 폴더 구조를 설계하는 방법에 대해서 질문합니다. 이 주제에 대한 정해진 정답이 없기 때문에, 작성하는 데에 꽤 오랜 시간이 걸렸습니다. 지난 몇년동안 리액트를 구현하면서, 제 개인 프로젝트(freelance, React workshops)를 통해 어떻게 제가 이 문제에 접근하는지 설명해드리겠습니다. 5 단계를 통해서 자신에게 얼마나 필요한 것인지 아닌지 결정할 수 있습니다. 시작하겠습니다. 누군가는 "나는 파일이 이동될 때까지 옮기는걸 반복해" 라고 말합니다. 이건 1인 ..
리액트(React.js)를 배우는 방법 출처(번역) How to learn React.js 2020년 올해 많은 자바스크립트 개발자가 리액트 배우는 방법에 대해 관심을 가졌습니다. 최근 자바스크립트 생태계 설문조사에 따르면 많은 개발자가 모던 웹 어플리케이션을 만들기 위해 리액트를 선택했습니다. 리액트의 인기와 수요로 인해 많은 자바스크립트 개발자가 리액트를 배우고 싶어합니다. 이 가이드에서, 저는 초보자들이 다른 길로 새거나, 난이도의 벽을 느끼지 않게끔 리액트 학습에 대한 포괄적인 방법에 대해 알려드리겠습니다. 리액트"만" 배우기 배움에 왕도는 없습니다. 인내심을 갖고 학습해야합니다. 이건 모든 개발자에게 동일합니다. 개인적으로 제가 개발자가 되는걸 좋아하는 이유입니다. 개발자는 항상 새로운 것을 배워야합니다. 호기심을 가진 개발자라면 리..

반응형