Title 컴포넌트폰트크기 theme 에 적용하기export type Headingsize = 'large' | 'medium' | 'small';interface Theme { name: ThemeName; color: { [key in ColorKey]: string; }; heading: { [key in Headingsize]: { fontSize: string; }; }; export const light: Theme = { name: 'light', color: { primary: 'brown', background: 'lightgray', secondary: 'blue', third: 'green', }, heading: { ..
웹 풀 사이클 데브코스
레이아웃?프로젝트의 기본적인 화면 구조를 잡는다반복적으로 들어가야하는 헤더, 푸터 등 매 화면마다 제공한다.상황과 필요에 따라 레이아웃이 변경될 수 있도록 대비한다. Header, Footer 통일된 레이아웃 컴포넌트방법각 화면 페이지마다 컴포넌트 호출레이아웃 pico css 사용index.html `https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css"/>`dark 테마 각 페이지마다 공통 컴포넌트 호출하는 경우Home.tsximport React from "react";import Header from "../components/common/Header";import Footer from "../components/common/Footer";..
인증 - query string 필터링 목록 - 상세화면 + 장바구니 - 주문서 작성, 목록 - 환경설정컨텍스트 api, use~~ 라이브러리로 전역 상태관리모달, 드롭다운, 포스트. 무한스크롤,. 슬라이드 배너 라이브러리없이 생성반응형 웹 CRA vs ViteCRAVitewebpack 압축ESBuild 롤업 빌드node.jsGolangexpress serverqkoa serversource buildmodule buildprocess.env.KEYimport.meta.env.KEYHMRHMRhttps://create-react-app.dev/https://vitejs.dev/guide/*HMR : Hot Module Reading. 개발 코드 변경시 화면에 즉시 적용타입스크립트는 HMR 사용안함Vite..
☑️ flow control, 제어 흐름, 흐름 제어사용자는 컴퓨터에게 명령하고, 컴퓨터는 이를 수행한다.특정 이벤트(trigger)로 시작해서~ 원하는 결과를 도출하며 종료된다. 명령형 프로그램의 개별 명령문, 명령 또는 함수 호출이 실행되거나 평가되는 순서goto다른 구문에서 시작.개발 설계의 오류를 발생시킬 수 있어 사용하지 말것!choice일부 조건이 충족되는 경우에만 일련의 명령문 실행`if-else`, `switch`loop어떤 조건이 충족될때까지 일련의 명령문을 0회 이상 실행Collection loop, General loop > 자료구조에 따라 종류가 존재한다.continue현재 실행 구문에서 떨어진 한 구문의 집합을 실행Loop continuationbreak프로그램 실행을 중단Loop..
채용 어필하는 방법협업 능력 : 코드 대화 가능, 이슈~토론프로젝트 문해력 : 기획, 설계, 구현~테스트, .. 유지보수, 리팩토리, 운영...코드 분석 : 언어의 특징, 인사이트 > 코드 구현 능력!개발 문화 속에서 성장 경험꾸준한 노력/개선 *블로그문서, 주석, 설계, 테스트, 기능 제안 > 개발자 한정 X IT 서비스 기획 : 이 기능이 구현 가능한지 파악할 수 있는 내용QA : 사용자의 경험 테스트다양한 부분에 큰 경쟁력이 될 것이다.팀스테이지 발표 70% 프로젝트 실패 > 하나의 요구사항 모두 지키지 못했는가? (기준 모호)기술 오류, 휴먼 에러, 전반적 프로세스, 실형 불가능, 사용자들과 접점 낮음플젝 + 위 문제사항을 해결할 줄 아는 사람인가?슈퍼유저의 시선 : 넓게 보고 잘 사용할 줄 아는..
오픈소스 찾기깃허브 Explore > Topics 에 핫한 주제의 오픈소스 및 프로젝트를 확인할 수 있다. GitHub: Let’s build from hereGitHub is where over 100 million developers shape the future of software, together. Contribute to the open source community, manage your Git repositories, review code like a pro, track bugs and fea...github.com오픈소스인 플젝도 있고, 아닌 플젝도 있다 > license 꼭 확인없는 코드라면? 가져와서 수정하면 안됨 > 포크 참고해서 다른 코드 만들거나, 레포 저장하기위한 포크 ok >..
오픈소스 구성원저작자 : 오픈소스 플젝 만든 사람 or 조직사용자 : 오픈소스 플젝 사용하는 사람Maintainer 메인테이너 : 프로젝트를 관리하는 책임이 있는 사람방향을 알고, 설정한 저작자 또는 컨트리뷰터 중 한명없어도 돌아가기는 한다. > 컨트리뷰터가 날린 pr 을 관리하는 커미터 존재contributor 컨트리뷰터 : 컨트리뷰션 활동을 하는 모든 사람Commitor 커미터 : 컨트리뷰션을 리뷰하는 사람. 컨트리뷰터 중 하나프로젝트에 반영할지 말지 결정 권한을 가지고 있는 컨트리뷰터없어도 된다 컨트리뷰터의 유형코드에 한정되지 않음 > 소스코드 뿐만 아니라 + 테스트, 배포, 가이드(문서화), 기획, 설계, 분석 등등....리액트 컨트리뷰터 1000명 이상.....~ 공식문서에서 가이드를 제공한다...
오픈소스 코드 공개시 > 깃허브 가이드수익을 챙길시 꼼꼼히 챙기기오픈소스의 공식 홈페이지 링크를 활용하기 프로젝트에 사용시 > 깃허브 레포지토리 Readme / License.txt 에 명시 오픈 소스 가이드Learn how to launch and grow your project.opensource.guideGitHub 프로젝트를 공개하는 것은 프로젝트 라이센싱과 동일하지 않습니다. 공개 프로젝트는 GitHub의 서비스 약관에 명시되어 있으며, 다른 사람들이 프로젝트를 보거나 포크할 수는 있지만, 다른 권한은 없습니다.오픈소스 정보 복사로 가져오기만 해도 ㄱㅊㄱㅊGPL 분유의 라이선스는 출처 외에도 챙겨야할 사항이 많다 > MIT 추천하는 문화 GitHub에서 새로운 프로젝트를 만들 때, 라이선스를 추..
개발자 선호 문화코딩테스트 인터뷰자율적 개인 개발 장비 선택자율적 팀 개발 환경 선택소스 코드 리뷰 및 테스트개발자 기여 로드맵/백로그지속적 통합 및 배보 CI/CD내부 소스 레포지터리 공유API를 기반한 연통 및 소통기술을 이해하는 팀장/매니저개발자 레벨 혹은 경력 관리참여형 지식 공유 플랫폼개발자 관계 DevRef 활동 참여형 지식 공유 플랫폼 Stack Overflow - Where Developers Learn, Share, & Build CareersStack Overflow | The World’s Largest Online Community for Developersstackoverflow.com개발자들은 서로 질문하고 도움을 주고받는다!** 깃허브 오픈소스 영향력 오픈소스누구나 특별한 제한..