{"id":20092665,"url":"https://github.com/inkyu0103/react-calendar","last_synced_at":"2026-06-08T11:31:39.745Z","repository":{"id":104004376,"uuid":"417496296","full_name":"inkyu0103/react-calendar","owner":"inkyu0103","description":"React를 이용한 달력 만들기","archived":false,"fork":false,"pushed_at":"2021-11-17T01:53:59.000Z","size":889,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-03-02T15:53:41.023Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/inkyu0103.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-10-15T12:45:03.000Z","updated_at":"2021-11-17T01:54:01.000Z","dependencies_parsed_at":null,"dependency_job_id":"4cf679c9-e24e-42c1-bd1c-cf79536e1ab3","html_url":"https://github.com/inkyu0103/react-calendar","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/inkyu0103/react-calendar","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/inkyu0103%2Freact-calendar","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/inkyu0103%2Freact-calendar/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/inkyu0103%2Freact-calendar/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/inkyu0103%2Freact-calendar/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/inkyu0103","download_url":"https://codeload.github.com/inkyu0103/react-calendar/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/inkyu0103%2Freact-calendar/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34061121,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-08T02:00:07.615Z","response_time":111,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-13T16:38:16.177Z","updated_at":"2026-06-08T11:31:39.726Z","avatar_url":"https://github.com/inkyu0103.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 리액트를 이용한 캘린더 만들기\n\n**결과 : https://inkyu0103.github.io/react-calendar/**\n\n---\n\n### 1. 캘린더 구조\n\n![캘린더구조](/docs/Calendar.png)\n\n---\n\n### 2. 기술 스택\n\n- React.js\n- emotion.js\n\n---\n\n### 3. 사용된 함수들\n\n| 함수 명          | 파라미터                                       | 설명                                                                                  |\n| ---------------- | ---------------------------------------------- | ------------------------------------------------------------------------------------- |\n| isLeapYear       | year : number                                  | 해당 연도의 윤년여부를 알려줍니다.                                                    |\n| handleIsSelected | year : number , month : number , date : number | year,month,date를 받아, 해당하는 날짜로 넘어가고, 그 날짜를 선택한 것으로 표시합니다. |\n| goToday          |                                                | 버튼을 누르면 오늘 날짜로 이동하고, 오늘 날짜에 focus를 줍니다.                       |\n| goNextMonth      |                                                | 다음달 달력을 렌더링합니다.                                                           |\n| goPreviousMonth  |                                                | 이전달 달력을 렌더링합니다.                                                           |\n| makeDateArray    |                                                | 렌더링 되는 날짜들을 배열에 담아 반환합니다                                           |\n\n---\n\n### 4. 캘린더 만들면서 고려한 점\n\n- 렌더링될 모든 데이터는 App 컴포넌트에서 관리했습니다. ( 컴포넌트 간 독립성 유지를 위해)\n\n- CalendarItem / CalendarButton은 따로 컴포넌트로 뽑아내어 재사용성을 고려하였습니다.\n\n- 객체 생성을 최소화 해보려 노력했습니다.\n\n---\n\n### 5. 참고한 디자인\n\n![](https://csshint.com/wp-content/uploads/2020/09/Calendar-js.jpg)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Finkyu0103%2Freact-calendar","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Finkyu0103%2Freact-calendar","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Finkyu0103%2Freact-calendar/lists"}