robots.txt가 무엇인지, 어떻게 적용하는지, 그리고 역할에 대해서 알아보는 시간을 갖도록 할게요! 검색엔진에 노출되기 위해 사이트를 네이버서치어드바이저, 또는 구글서치콘솔을 사용한 분이라면 당연히 알고 있을거라고 생각해요. robots.txt도 SEO(검색엔진최적화)를 위해서 꼭 있어야하는 존재인만큼 다뤄보도록 하겠습니다! robots.txt는 무엇일까? 구글 서치 콘솔에서는 아래와 같이 설명하고 있습니다. robots.txt는 크롤링해서는 안 되는 사이트 내 URL 또는 디렉터리를 검색엔진에 알려주는 텍스트 파일의 이름입니다. 특정 크롤러(또는 모든 크롤러)에 대해 개별 URL 또는 전체 디렉터리를 차단하는 규칙이 포함되어 있습니다 위의 글을 읽어보면 알겠지만, 이 파일은 봇을 차단 또는 사이트..

오늘은 메타태그 설정을 통해 SEO에 영향을 미치는 요소를 알아보도록 할게요! 모든 내용은 mdn web docs의 내용을 기반으로 설명할테니 하단 레퍼런스도 참고해주세요. 예시는 저의 프로젝트 사이트인 문제은행 Exambomb에서 확인할 수 있어요! https://exam-bomb-service.vercel.app/ 기사 필/실기 문제은행(기출문제, 시험) | Exam Bomb. 기사 필/실기 시험대비 문제은행을 제공해요. 기출문제, 시험 등 다양한 문제가 준비됐어요. exam-bomb-service.vercel.app Meta Tittle 먼저 타이틀에 대한 설명이에요. 페이지 제목은 SEO에 큰 영향을 줍니다. 권장사항으로는 15자 이내로 유저의 주목을 이끌수 있는 "훅"이 바로 이 부분입니다. 유..

리팩터링은 분명 가치 있는 도구이지만, 정말 생각지못하게 실수를 저지르기 마련이에요. 그렇기때문에 그러한 부분을 견고하게 잡아줄 테스트 구축이 매우 중요하답니다. 이제 테스트를 통해 우리는 어떤 효율을 기대해야하는지 알아볼까요?! 자가 테스트 코드의 가치 모든 테스트를 완전히 자동화하고 그 결과까지 스스로 검사하게 만들자. 우리는 작성한 테스트코드를 수시로 확인해야해요. 테스트를 수시로 확인하면 우리가 어느 부분을 수정했기에 오류가 발생했는지 곧바로 체크할 수 있으니깐요. 실제로 기능 구현에 집중하는 시기에 테스트 코드를 작성했었다면, 화면을 보지 않아도 테스트 코드의 작동만을 통해서 우리는 정답을 알 수 있어요! 실제로 최근 저도 저희 서비스의 공공데이터 영역의 테스트 코드를 작성했어요. 확실히 테스트..

오늘도 지난 시간에 이어서 다시 코드스멜 2탄을 하려해요! 오늘 내용에서 되게 많은 내용을 제거시켰는데, 대부분이 클래스를 활용한 방법이여서 뺏어요! 제가 javascript에서 클래스를 자주 쓰지 않기도 하고, 실제 적용을 어떤식으로 나타낼지 난감하기도해서 그랬으니 이해해주세요! 그럼 이제 시작해볼까요!! 긴 매개변수 목록 함수의 매개변수가 많아지면 그 자체로 이해하기 어려워져요! 우리는 최대 2개로 매개변수를 최소화하려고 해요. (어쩔수없으면 3개…?!?) 또한 매개변수 중 하나로 플래그 형태를 자주 쓰지않나요? (주로 true, false를 통해 나누는) 저는 아래처럼 함수안에서 타입별로 무언가를 나누는 함수를 작성했었어요! const getDurationTimeBy = (distance:numbe..

안녕하세요! 오랜만에 정보처리기사 기출 문제은행 서비스 업데이트 관련하여 추가된 내용을 공유하려해요! 지금까지 블로그로만 홍보하여 유입된 서비스 사용유저들의 통계를 공유하려해요. 또한 업데이트를 통해 더 많은 이용자가 늘면 좋겠다고 생각하여 업데이트 내용을 공유해드려요! https://exam-bomb-service.vercel.app/ Exam Bomb - 정보처리기사 문제은행 정보처리기사 시험대비 문제은행 서비스입니다. 시험형식 풀기는 로그인 전용 서비스, 문제 형식은 로그인 제한 없는 서비스입니다. exam-bomb-service.vercel.app 문제은행 서비스 유저 통계 총 가입유저 : 50명 총 테스트친 수: 232회 총 시도한 문제 수 : 7708회 총 푼 문제 수 : 3595회 총 정답 ..

오늘은 리팩터링 2판 3단원의 코드스멜 단원을 읽으며 드는 생각을 나눠보려해요~ 그리고 내용을 읽어보면서 팀문화에 녹여낼 수 있다면 좋겠다는 점도 써보고싶어요! 기이한 이름 기이한 이름 단원에서 설명하고자하는 바는 N년차 개발자들의 최대 고민인 변수(함수)명 짓기에 해당해요. 해당 파일을 작성하고 있는 본인은 당연하다고 생각한 "이름 짓기"도 처음보는 사람 입장에선 전혀 이해가 안가는 경우가 있을거에요. 저는 최대한 코드의 맥락을 통해 어떤 역할을 담당하는지 나타내고자 스스로 "리팩터링"을 진행하며, “코드리뷰”를 통해 다시 한번 체크하고 넘어가고 있어요! 대표적으로 아래와 같은 함수를 리팩터링을 통해 효과를 얻을 수 있어요! {getDurationTimeBy(distance)} // 결과값 : 00분 ..

이번 내용을 읽으면서는 다음과 같은 내용을 나누고 싶었어요. 언제 리팩터링을 하면 좋을지 명확하게 정할 수 있는 개발자, 그리고 적용할 수 있는 문화를 갖춰가는 개발팀이 되기 위해서 리팩터링을 언제할지 생각해보면 좋겠어요. 2.4 언제 리팩터링해야 할까? 리팩터링을 하는 시기는 생각보다 자주 일어나요. 저자는 거의 한시간마다 한 번은 한다고 말해요! 하지만 뭐든지 시기가 중요한게 아니라! 자연스럽게 본인의 개발 스타일에 맞게 리팩터링을 하는 시기를 녹여내는게 중요한거겠죠?? 저는 책을 읽으며, 그리고 직접 최근에 계속해서 적용해보며 앞으로 새로운 기능 개발을 할 때, 이렇게 하려고 해요! 보이스카웃트 원칙! 기능을 쉽게 추가할 수 있도록 리팩터링 기능 구현 (기능 중심 개발) 자가 리팩터링 (컴포넌트 분..

리팩터링하는 이유는 무엇인지 알아보려해요. 최근 개발하면서 리팩터링을 하셨나요? 했다면 어떤 이유로 하셨나요?! (오늘도 어김없이 컨셉을 잡습니다 ㅎ) 리팩터링을 통해 모든 문제점이 해결하는건 아니지만, 우리가 확실히 얻을 수 있는 이점은 꼭 얻었으면 좋겠어요. 우리가 왜 리팩터링을 해야하는지 한번 나눠볼게요! 소프트웨어 설계가 좋아지게 하자! 대표적으로 중복 코드가 여기저기 뿌려져있다면 모든 곳을 수정했는지 알 수 없어요. 그 말은 해당 코드를 수정할 때, 모든 곳에서 예상대로 작동할 것을 확신할 수 있을까요? 바람직한 설계의 핵심은 모든 코드가 언제나 고유한 일을 수행함을 보장할 수 있어야해요. // / 오픈채팅링크 // /user 오픈채팅링크 // /home 오픈채팅링크 // /test 오픈채팅링크..

오늘은 NextJs를 사용하여 정적 사이트(SSG말고 build파일)를 배포해야하는 상황에서 build 파일을 만드는 과정을 알아볼게요! 정적사이트로 배포를 해야할 이유가 없다면 next start 해서 사용하는게 낫지만, 굳이 필요한 상황이라면 쓸 수 있는 방법을 확인해볼게요! 일단 최신 버전인 Next v13.3.0 이상부터는 next export를 다르게 사용해야해요. 이 버전인 사람은 아래 링크로 확인해주세요! (저는 Next v13 기준이며, app directory를 사용하지 않는 상황입니다.) https://nextjs.org/docs/pages/building-your-application/deploying/static-exports Deploying: Static Exports | Nex..

2. 리팩터링 원칙 2주차 개발 스터디를 참여하며 리팩터링 2장을 읽으며, 공유해보자해요. 이번 단원부터는 본격적으로 리팩터링이 어떤 원칙을 중심으로 진행되는지 차근차근 알려드리도록 할게요! 2.1 리팩터링 정의 리팩터링[명사] : 소프트웨어의 겉보기 동작은 그대로 유지한 채, 코드를 이해하고 수정하기 쉬도록 내부 구조를 변경하는 기법 리팩터링하다[동사] : 소프트웨어의 겉보기 동작은 그대로 유지한 채, 여러 가지 리팩터링 기법을 적용해서 소프트웨어를 재구성하다. 자 리팩터링은 명사, 동사 두가지로 위와 같이 소개할 수 있어요. 중요한 점은 겉보기 동작이 그대로 유지된 채, 소프트웨어가 재구성(개선)되는 작업을 리팩터링이라고 한다는 것을 알 수 있죠! 자 그러면 본격적으로 리팩터링하러 가볼까요?! 여러분..