(3D)Dev Deep Dive
-
백준 알고리즘 문제를 풀 때는 입력을 받고 그 입력을 바탕으로 계산을 수행한 뒤 결과를 출력하는 형태가 일반적이므로, 이를 기반으로 한 간단한 Node.js 템플릿을 만들어 이 글에 제시하였습니다. 백준 바로가기 Baekjoon Online Judge Baekjoon Online Judge 프로그래밍 문제를 풀고 온라인으로 채점받을 수 있는 곳입니다. www.acmicpc.net Node.js 환경에서 사용할 수 있는 Beakjoon용 코드 템플릿 주석을 통해 나눠둔 몇 가지 주요 입력방식에 따른 기본 템플릿입니다. 문제 유형에 따라 주석을 해제하거나 이를 참고하여 입력받는 로직을 완성시키신 이후, 아래의 solution 함수 내부에 정답을 위한 코드를 적어 사용하시면 됩니다. // 이 두 줄을 필수로 ..
[Template] JavaScript(Node.js) Template for Baekjoon백준 알고리즘 문제를 풀 때는 입력을 받고 그 입력을 바탕으로 계산을 수행한 뒤 결과를 출력하는 형태가 일반적이므로, 이를 기반으로 한 간단한 Node.js 템플릿을 만들어 이 글에 제시하였습니다. 백준 바로가기 Baekjoon Online Judge Baekjoon Online Judge 프로그래밍 문제를 풀고 온라인으로 채점받을 수 있는 곳입니다. www.acmicpc.net Node.js 환경에서 사용할 수 있는 Beakjoon용 코드 템플릿 주석을 통해 나눠둔 몇 가지 주요 입력방식에 따른 기본 템플릿입니다. 문제 유형에 따라 주석을 해제하거나 이를 참고하여 입력받는 로직을 완성시키신 이후, 아래의 solution 함수 내부에 정답을 위한 코드를 적어 사용하시면 됩니다. // 이 두 줄을 필수로 ..
2023.05.17 -
ESLint는 개발할 때 있어 매우 유용하게 쓰이는 코드 품질을 책임져주는 도구들 중 하나입니다. 그리고 여기에는 개발을 하고 ESLint를 사용할 때 미리 커스텀을 해둘 수 있는 파일인 .eslintrc.js의 템플릿을 미리 만들어두었습니다. 개발환경 세팅을 할 때 이 글이 많은 도움이 되길 바랍니다. 아래에는 참고하면 좋을 관련 글과 작성하는데 참고했던 프리티어 공식 문서를 두었습니다. [ESLint, husky, Prettier] 당신의 코드 품질을 책임져주는 3가지 도구들 ESLint? Husky? Prettier? ESLint, Husky, Prettier는 프로그래밍을 할 때 코드 품질과 일관성을 유지하기 위한 도구입니다. 그리고 이제 개발의 세계에서는 코드 품질과 일관성을 유지하는 것이 굉장..
[Template] ESLint Template for FrontEnd DevelopersESLint는 개발할 때 있어 매우 유용하게 쓰이는 코드 품질을 책임져주는 도구들 중 하나입니다. 그리고 여기에는 개발을 하고 ESLint를 사용할 때 미리 커스텀을 해둘 수 있는 파일인 .eslintrc.js의 템플릿을 미리 만들어두었습니다. 개발환경 세팅을 할 때 이 글이 많은 도움이 되길 바랍니다. 아래에는 참고하면 좋을 관련 글과 작성하는데 참고했던 프리티어 공식 문서를 두었습니다. [ESLint, husky, Prettier] 당신의 코드 품질을 책임져주는 3가지 도구들 ESLint? Husky? Prettier? ESLint, Husky, Prettier는 프로그래밍을 할 때 코드 품질과 일관성을 유지하기 위한 도구입니다. 그리고 이제 개발의 세계에서는 코드 품질과 일관성을 유지하는 것이 굉장..
2023.05.13 -
Prettier은 개발할 때 있어 매우 유용하게 쓰이는 코드 품질을 책임져주는 도구들 중 하나입니다. 그리고 여기에는 프론트엔드 개발을 하고 prettier을 사용할 때 미리 커스텀을 해둘 수 있는 파일인 .prettierrc의 템플릿을 미리 만들어두었습니다. 개발 시작할 때 이 글이 많은 도움이 되길 바랍니다. 아래에는 참고하면 좋을 관련 글과 작성하는데 참고했던 프리티어 공식 문서를 두었습니다. [ESLint, husky, Prettier] 당신의 코드 품질을 책임져주는 3가지 도구들 ESLint? Husky? Prettier? ESLint, Husky, Prettier는 프로그래밍을 할 때 코드 품질과 일관성을 유지하기 위한 도구입니다. 그리고 이제 개발의 세계에서는 코드 품질과 일관성을 유지하는 ..
[Template] Prettier Template for FrontEnd DevelopersPrettier은 개발할 때 있어 매우 유용하게 쓰이는 코드 품질을 책임져주는 도구들 중 하나입니다. 그리고 여기에는 프론트엔드 개발을 하고 prettier을 사용할 때 미리 커스텀을 해둘 수 있는 파일인 .prettierrc의 템플릿을 미리 만들어두었습니다. 개발 시작할 때 이 글이 많은 도움이 되길 바랍니다. 아래에는 참고하면 좋을 관련 글과 작성하는데 참고했던 프리티어 공식 문서를 두었습니다. [ESLint, husky, Prettier] 당신의 코드 품질을 책임져주는 3가지 도구들 ESLint? Husky? Prettier? ESLint, Husky, Prettier는 프로그래밍을 할 때 코드 품질과 일관성을 유지하기 위한 도구입니다. 그리고 이제 개발의 세계에서는 코드 품질과 일관성을 유지하는 ..
2023.05.13 -
2023 Series [ 2023 ] CheckPoint, 2023년 2023년동안 작성했던 회고록들을 모아 둔 게시글이다 2023년 동안 작성한 회고들을 계속해서 업데이트 해 나갈 예정이다 [ January ] - 변화의 시작, 1월 더보기 [2022WinterBootcamp] 0~1주차 회고 개발자가 time-map-installer.tistory.com 1편에서는 무슨 일이 있었을까? 일찍 학교에 와서 아침을 먹으며 여러 생각을 했다. 맛있는 샐러드와 주먹밥을 먹으며 "동적 컴포넌트를 만들면 잠이 깰까?"라는 의문이 떠올랐다. 그래서 동적 컴포넌트와 정적 컴포넌트의 차이에 대해 생각해 보았고, 리액트에서도 동적인 사이트와 정적인 사이트가 있다는 것을 알게 되었다. 내가 이것에 대해 깊이 생각하게 된..
[문득 떠오른 건데] 밥먹고 졸릴때 리팩토링 요소를 탐색하면 잠이 깰까? - 2편2023 Series [ 2023 ] CheckPoint, 2023년 2023년동안 작성했던 회고록들을 모아 둔 게시글이다 2023년 동안 작성한 회고들을 계속해서 업데이트 해 나갈 예정이다 [ January ] - 변화의 시작, 1월 더보기 [2022WinterBootcamp] 0~1주차 회고 개발자가 time-map-installer.tistory.com 1편에서는 무슨 일이 있었을까? 일찍 학교에 와서 아침을 먹으며 여러 생각을 했다. 맛있는 샐러드와 주먹밥을 먹으며 "동적 컴포넌트를 만들면 잠이 깰까?"라는 의문이 떠올랐다. 그래서 동적 컴포넌트와 정적 컴포넌트의 차이에 대해 생각해 보았고, 리액트에서도 동적인 사이트와 정적인 사이트가 있다는 것을 알게 되었다. 내가 이것에 대해 깊이 생각하게 된..
2023.05.02 -
Github Label Setting은 Github 프로젝트에서 이슈와 풀 리퀘스트에 태그를 지정하여 작업을 분류하고 조직화하는 데 사용되는 기능입니다. 이를 사용하면 프로젝트 관리가 훨씬 수월해지며, 몇 가지 주요 이점이 있습니다. 이슈 및 풀 리퀘스트 분류 레이블을 사용하면 이슈와 풀 리퀘스트를 효과적으로 분류할 수 있습니다. 예를 들어, 버그, 기능 요청, 문서 개선 등과 같은 카테고리로 나눌 수 있습니다. 작업 우선순위 지정 레이블을 이용해 작업의 우선순위를 표시할 수 있습니다. 예를 들어, 긴급, 높음, 중간, 낮음 등의 우선순위를 나타내는 레이블을 만들 수 있습니다. 팀 협업 향상 팀원들이 레이블을 통해 작업을 빠르게 파악할 수 있어 효율적인 협업이 가능합니다. 이슈 및 풀 리퀘스트 필터링 레..
[Template] GitHub Label SettingGithub Label Setting은 Github 프로젝트에서 이슈와 풀 리퀘스트에 태그를 지정하여 작업을 분류하고 조직화하는 데 사용되는 기능입니다. 이를 사용하면 프로젝트 관리가 훨씬 수월해지며, 몇 가지 주요 이점이 있습니다. 이슈 및 풀 리퀘스트 분류 레이블을 사용하면 이슈와 풀 리퀘스트를 효과적으로 분류할 수 있습니다. 예를 들어, 버그, 기능 요청, 문서 개선 등과 같은 카테고리로 나눌 수 있습니다. 작업 우선순위 지정 레이블을 이용해 작업의 우선순위를 표시할 수 있습니다. 예를 들어, 긴급, 높음, 중간, 낮음 등의 우선순위를 나타내는 레이블을 만들 수 있습니다. 팀 협업 향상 팀원들이 레이블을 통해 작업을 빠르게 파악할 수 있어 효율적인 협업이 가능합니다. 이슈 및 풀 리퀘스트 필터링 레..
2023.04.23 -
Issue Template은 프로젝트 관리 및 협업 툴에서 사용되는 미리 정의된 형식의 템플릿으로, 팀원들이 일관된 정보를 공유하고 문제를 신속하게 해결할 수 있도록 돕습니다 일반적으로 GitHub, GitLab, Jira 등의 협업 도구에서 사용됩니다 Issue Template의 장점들 일관성 템플릿을 사용하면 팀원들이 동일한 형식을 따르도록 유도하여 일관된 이슈 제출을 돕습니다. 이로 인해 정보 공유가 더 효과적이고 효율적으로 이루어집니다. 효율성 템플릿에 필요한 정보가 미리 명시되어 있어, 팀원들이 이슈를 보다 신속하게 작성하고 해결할 수 있습니다. 커뮤니케이션 개선 모든 관련 정보가 한 곳에 모여 있어, 이슈에 대한 논의와 해결 과정에서 오해가 줄어듭니다. 시간 절약 이슈를 작성하는 데 걸리는 시..
[Template] Issue TemplateIssue Template은 프로젝트 관리 및 협업 툴에서 사용되는 미리 정의된 형식의 템플릿으로, 팀원들이 일관된 정보를 공유하고 문제를 신속하게 해결할 수 있도록 돕습니다 일반적으로 GitHub, GitLab, Jira 등의 협업 도구에서 사용됩니다 Issue Template의 장점들 일관성 템플릿을 사용하면 팀원들이 동일한 형식을 따르도록 유도하여 일관된 이슈 제출을 돕습니다. 이로 인해 정보 공유가 더 효과적이고 효율적으로 이루어집니다. 효율성 템플릿에 필요한 정보가 미리 명시되어 있어, 팀원들이 이슈를 보다 신속하게 작성하고 해결할 수 있습니다. 커뮤니케이션 개선 모든 관련 정보가 한 곳에 모여 있어, 이슈에 대한 논의와 해결 과정에서 오해가 줄어듭니다. 시간 절약 이슈를 작성하는 데 걸리는 시..
2023.04.23 -
Git branch naming convention은 Git 저장소에서 사용되는 브랜치 이름을 표준화하여 일관성을 유지하고 명료한 커뮤니케이션을 도모하는 방법입니다. 이런 일관성 있는 이름 규칙을 사용함으로써 협업을 용이하게 하고, 브랜치 관리를 효과적으로 할 수 있습니다. Git branch naming convention의 장점들 명확한 커뮤니케이션 브랜치 이름이 직관적이고 일관되면, 프로젝트 참여자들이 브랜치의 목적과 내용을 쉽게 파악할 수 있습니다. 브랜치 관리 용이 규칙에 따라 브랜치를 생성하면, 사용자들이 언제 어떤 브랜치를 만들었는지 쉽게 추적할 수 있습니다. 더 나은 협업 일관된 규칙을 따르면 프로젝트 참여자들 간의 혼동을 줄이고, 코드 리뷰 및 병합 과정에서 발생할 수 있는 실수를 줄일 ..
[Template] Git Branch Naming ConventionGit branch naming convention은 Git 저장소에서 사용되는 브랜치 이름을 표준화하여 일관성을 유지하고 명료한 커뮤니케이션을 도모하는 방법입니다. 이런 일관성 있는 이름 규칙을 사용함으로써 협업을 용이하게 하고, 브랜치 관리를 효과적으로 할 수 있습니다. Git branch naming convention의 장점들 명확한 커뮤니케이션 브랜치 이름이 직관적이고 일관되면, 프로젝트 참여자들이 브랜치의 목적과 내용을 쉽게 파악할 수 있습니다. 브랜치 관리 용이 규칙에 따라 브랜치를 생성하면, 사용자들이 언제 어떤 브랜치를 만들었는지 쉽게 추적할 수 있습니다. 더 나은 협업 일관된 규칙을 따르면 프로젝트 참여자들 간의 혼동을 줄이고, 코드 리뷰 및 병합 과정에서 발생할 수 있는 실수를 줄일 ..
2023.04.23 -
2023 Series [ 2023 ] CheckPoint, 2023년 2023년동안 작성했던 회고록들을 모아 둔 게시글이다 2023년 동안 작성한 회고들을 계속해서 업데이트 해 나갈 예정이다 [ January ] - 변화의 시작, 1월 더보기 [2022WinterBootcamp] 0~1주차 회고 개발자가 time-map-installer.tistory.com 학교에 일찍 와서 아침을 먹으며 여러 생각을 하던 날이었다. 아침으로 맛있는 샐러드와 주먹밥을 먹으며 갑자기 떠오른 의문, "동적 컴포넌트를 만들면 잠이 깰까?" 사람들 중에 밥을 먹고 식곤증이 와서 많이 졸려하는 사람들이 있다 나도 그 사람들 중 한 사람이지만 동적인 활동을 하면 잠이 깨는 편이었다 "어? 그러고 보니 리액트에도 동적인 사이트와 정..
[문득 떠오른 건데] 밥먹고 졸릴때 동적 컴포넌트를 만들면 잠이 깰까? - 1편2023 Series [ 2023 ] CheckPoint, 2023년 2023년동안 작성했던 회고록들을 모아 둔 게시글이다 2023년 동안 작성한 회고들을 계속해서 업데이트 해 나갈 예정이다 [ January ] - 변화의 시작, 1월 더보기 [2022WinterBootcamp] 0~1주차 회고 개발자가 time-map-installer.tistory.com 학교에 일찍 와서 아침을 먹으며 여러 생각을 하던 날이었다. 아침으로 맛있는 샐러드와 주먹밥을 먹으며 갑자기 떠오른 의문, "동적 컴포넌트를 만들면 잠이 깰까?" 사람들 중에 밥을 먹고 식곤증이 와서 많이 졸려하는 사람들이 있다 나도 그 사람들 중 한 사람이지만 동적인 활동을 하면 잠이 깨는 편이었다 "어? 그러고 보니 리액트에도 동적인 사이트와 정..
2023.04.22 -
일단 저장해두면 굉장히 좋은 곳에 쓸 것 같은 기능이라 가져와 보았습니다 코드를 뜯어보면 동적인 애니메이션 관련 코드들에 대해 알 수 있기에 굉장히 의미있는 코드들이라고 생각합니다 seroSlide.html Welcome to Coda Let's play programming with HTML/CSS seroSlide.css body{ margin: 0; padding: 0; font-family: montserrat, sans-serif; background: black; } .animated-text{ color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #2980b9; pad..
[HTML+CSS] 텍스트 슬라이드 기능(가로/세로)일단 저장해두면 굉장히 좋은 곳에 쓸 것 같은 기능이라 가져와 보았습니다 코드를 뜯어보면 동적인 애니메이션 관련 코드들에 대해 알 수 있기에 굉장히 의미있는 코드들이라고 생각합니다 seroSlide.html Welcome to Coda Let's play programming with HTML/CSS seroSlide.css body{ margin: 0; padding: 0; font-family: montserrat, sans-serif; background: black; } .animated-text{ color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #2980b9; pad..
2022.11.21 -
오늘은 좌측에는 검색창, 중앙에는 로고, 우측에는 부가메뉴가 있는 헤더를 만들어보려 한다 우선 다음 글에서 기본적인 틀을 나눠둔 코드를 가져오도록 하겠다 0. 코드 준비 [HTML+CSS] 무작정 따라 만들어보기(쿠팡 footer만들기 1편) HTML, CSS를 그 누구보다 더 빠르고 정확하고 생동감 있고 실감 나게 체험을 해 보고 싶었던 나는 일단 유명한 브랜드의 웹 페이지를 직접 따라 만들면서 이게 이런 거구나 라는 감정을 느껴보고 time-map-installer.tistory.com 언제나 시작할 때 코드를 입력할 공간을 준비를 해 두는 것이 좋다 1. 헤더 나누기 총 세 가지 요소가 들어갈 것이기에 3등분을 해 둔다 #header { border: 1px solid red; height: 20%..
[HTML+CSS] Copang 반응형 헤더 만들기(검색창/로고/부가메뉴)오늘은 좌측에는 검색창, 중앙에는 로고, 우측에는 부가메뉴가 있는 헤더를 만들어보려 한다 우선 다음 글에서 기본적인 틀을 나눠둔 코드를 가져오도록 하겠다 0. 코드 준비 [HTML+CSS] 무작정 따라 만들어보기(쿠팡 footer만들기 1편) HTML, CSS를 그 누구보다 더 빠르고 정확하고 생동감 있고 실감 나게 체험을 해 보고 싶었던 나는 일단 유명한 브랜드의 웹 페이지를 직접 따라 만들면서 이게 이런 거구나 라는 감정을 느껴보고 time-map-installer.tistory.com 언제나 시작할 때 코드를 입력할 공간을 준비를 해 두는 것이 좋다 1. 헤더 나누기 총 세 가지 요소가 들어갈 것이기에 3등분을 해 둔다 #header { border: 1px solid red; height: 20%..
2022.11.21 -
회원가입 폼에대한 코드를 가공해 보았다 웹페이지에는 회원가입이 거의 필수적이다보니 가져와서 저장해두면 언젠가는 반드시 쓸모가 있을 것이라 생각한다 아이디확인 비밀번호 비밀번호 재확인 이름 생년월일 성별 -- 선택 -- 남자 여자 이메일 휴대전화 다중 선택 선택1 선택2 선택3 선택4 파일 제출 폼
[HTML] 회원가입 양식회원가입 폼에대한 코드를 가공해 보았다 웹페이지에는 회원가입이 거의 필수적이다보니 가져와서 저장해두면 언젠가는 반드시 쓸모가 있을 것이라 생각한다 아이디확인 비밀번호 비밀번호 재확인 이름 생년월일 성별 -- 선택 -- 남자 여자 이메일 휴대전화 다중 선택 선택1 선택2 선택3 선택4 파일 제출 폼
2022.11.21