코드 리뷰를 자동으로 해 주는 툴이 있다고 해서 적용해 보았는데요CodeRabbit 에 먼저 들어갑니다.여기서 Get a free trial을 클릭합니다.저는 github와 바로 연동하기 위해 Sign up with Github를 클릭해 주었습니다.깃허브 내에서 코드래
저는 현재 학교에서 동아리 지원 관리 플랫폼을 제작 중입니다. 아래는 해당 프로젝트 깃허브 링크입니다.moadong이번에 메인페이지에 들어갈 캐러셀을 제작하게 되었습니다.Typescript와 styled-component를 사용하였고 반응형과 무한 캐러셀 동작에 집중하
Library가 아닌 Framework 이기 때문(= React.js 전용 웹 개발 프레임워크 but, React는 라이브러리)기능 구현의 주도권이 누구에게 있는가?주도권이 개발자에게 있다 -> Library주도권이 개발자에게 없다 → FrameworkLibrary어떤
지금 만들고 있는 동아리 지원 플랫폼에서 디자이너분이 주신 피그마 영상입니다. 이 페이지는 동아리 상세보기 페이지입니다. 개발하려고 하는 것은 모집정보, 동아리정보, 소개글, 활동사진이 있는 탭과 자동 스크롤입니다.탭 클릭 시 클릭된 메뉴의 아래 테두리가 검게 칠해진다
2개의 타입 Dog와 Cat의 유니온 타입인 Animal 타입까지 정의했습니다.매개변수로 Animal 타입의 값을 받아 동물에 따라 각각 다른 경고를 콘솔에 출력하는 함수를 만들었습니다. 이때, Dog또는 Cat타입인지 알기 위해 in 연산자를 이용해 타입을 좁힙니다.
저는 React로 웹을 개발해오던 사람입니다. 최근 간단하게 앱을 만들 일이 있어서 알아보다가, 제가 쓰던 React와 가장 비슷한 React Native를 알게 되었습니다. 저는 이 두 개가 어떻게 다르며, 왜 나누었을까 하는 궁금증이 생겼습니다. 자바스크립트 컴포넌
컴포넌트 관리의 필요성 프론트엔드 개발자라면 공통으로 사용되는 컴포넌트 관리를 위해 많은 신경을 쓴 경험이 있을 것입니다. 저는 이번에 동아리 지원 플랫폼 개발을 시작했는데요, 여기서 Storybook을 도입하고자 합니다. 처음에는 Storybook을 왜 사용하는지
동기 자바스크립트는 싱글 스레드 기반 언어입니다. 한 번에 하나의 작업을 수행한다는 뜻인데요, 동시에 여러 작업을 할 수 없다는 뜻이기도 합니다. 를 하면 1과 2가 순서대로 출력될 것입니다. 이렇게 순차적으로 동작하는 것이 동기적으로 동작한다고 볼 수 있습니다.
React.memo는 props의 얕은 비교를 통해 자식 컴포넌트가 받을 props가 이전과 동일한 경우, 자식 컴포넌트의 리렌더링을 방지한다.부모가 렌더링되어도 자식에게 전달된 props가 참조적으로 동일할 때자식 컴포넌트 내부의 상태나 context 값이 변경되지
저는 이번에 React 공식문서를 통해 갖가지 Hook들의 동작원리를 알아보려고 해요. 개발할 때 안 쓰이는 곳이 없을 정도지만 어떤 원리로 사용해야 하는지 아직 잘 모르겠다고 생각했어요. useState State를 통해 컴포넌트는 정보를 기억해요. 개발 중 많이
상근이는 요즘 설탕공장에서 설탕을 배달하고 있다. 상근이는 지금 사탕가게에 설탕을 정확하게 N킬로그램을 배달해야 한다. 설탕공장에서 만드는 설탕은 봉지에 담겨져 있다. 봉지는 3킬로그램 봉지와 5킬로그램 봉지가 있다.상근이는 귀찮기 때문에, 최대한 적은 봉지를 들고 가
프론트엔드 개발을 하는 사람들은 대부분 React라는 라이브러리를 사용합니다. 저 또한 프론트엔드를 개발하고 있기에 리액트를 사용하고 있습니다. 사용하는 입장에서 편하긴 편한데 정확히 뭐가 편한지 잘 모른다는 생각이 들었습니다.다른 프레임워크나 라이브러리를 써 본 적이
기존에 music DNA라는 프로젝트를 하면서 같이 일하던 친구에게 한 요청이 왔다. "가수 이름의 배치가 안 맞아. 혹시 위치를 통일해줄 수 있어?"프로젝트 결과에 가수사진과 이름을 넣는 테이블이 있었는데 비교적 긴 이름이 모바일 화면에서 두 줄로 처리되었다. 결과적
코드를 짜면서 ==나 ===를 정말 많이 쓴다. 같거나 같지 않음을 비교하는 경우가 많은데, 어떤식으로 비교하는지 모르고 그냥 쓰게 될 떄가 다반사인 것 같다. 이번 기회에 동등 연산자에 대해 자세히 알아보고자 한다.예시 코드를 가져왔는데 간단하게 생각하면 타입에 느슨
4주차 과제를 클릭하니 제일 위에 적힌 것은 회고였다. 제출 전 3시간 동안 열심히 쓴 회고글 중 일부를 공유해본다.💡목표코드 리뷰는 의도가 없던 내 코드에 의도를 만들어 주었다. 코드 리뷰를 하면서 어떤 의도로 짰는지에 대해 스스로 생각하고 답변을 할 수 있었고,
자라기 자신이 이미 갖고 있는 것들을 잘 활용해라 새로운 걸 유입시키는 데에만 집중하면 새로운 것들이 이미 있는 것들을 덮어버릴 수 있다. 내가 그 지식을 얼마나 활용하는지 반성하자. 이미 갖고 있는 것을 서로 촘촘히 연결하라. 새로운 것이 들어오면 이미 갖고 있는
자동차 경주 🌱 기능 요구 사항 리드미 작성하기 경주할 자동차 이름 입력받기 이름 검증하기 경주 시도 횟수 입력받기 2-1) 시도 횟수 검증하기 랜덤숫자 생성하기 3-1) 4이상일 때 자동차 전진 우승자 구하기 4-1) 우승자 없으면 에러 🌱 입출력 요구 사항
문자열 덧셈 계산기 🌱 기능 요구 사항 입력한 문자열에서 숫자를 추출하여 더하는 계산기를 구현한다. 쉼표(,) 또는 콜론(:)을 구분자로 가지는 문자열을 전달하는 경우 구분자를 기준으로 분리한 각 숫자의 합을 반환한다. 앞의 기본 구분자(쉼표, 콜론) 외에 커스