{"id":27409246,"url":"https://github.com/toa-web-dev/toa-web-dev","last_synced_at":"2026-01-31T14:32:52.833Z","repository":{"id":222616444,"uuid":"757897448","full_name":"toa-web-dev/toa-web-dev","owner":"toa-web-dev","description":null,"archived":false,"fork":false,"pushed_at":"2025-01-11T06:30:09.000Z","size":92,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-06-12T06:06:42.408Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":null,"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/toa-web-dev.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,"zenodo":null}},"created_at":"2024-02-15T08:03:10.000Z","updated_at":"2025-01-11T06:30:13.000Z","dependencies_parsed_at":"2025-04-14T07:34:42.696Z","dependency_job_id":"09f7d58f-5459-4989-bc4f-046d709d17bf","html_url":"https://github.com/toa-web-dev/toa-web-dev","commit_stats":null,"previous_names":["toa-web-dev/toa-web-dev"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/toa-web-dev/toa-web-dev","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/toa-web-dev%2Ftoa-web-dev","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/toa-web-dev%2Ftoa-web-dev/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/toa-web-dev%2Ftoa-web-dev/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/toa-web-dev%2Ftoa-web-dev/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/toa-web-dev","download_url":"https://codeload.github.com/toa-web-dev/toa-web-dev/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/toa-web-dev%2Ftoa-web-dev/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28945670,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-31T14:26:55.697Z","status":"ssl_error","status_checked_at":"2026-01-31T14:26:52.545Z","response_time":128,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"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":"2025-04-14T07:24:26.341Z","updated_at":"2026-01-31T14:32:52.817Z","avatar_url":"https://github.com/toa-web-dev.png","language":null,"funding_links":[],"categories":[],"sub_categories":[],"readme":"\n# 기술 스택\n\n### Javascript\n- DOM 요소를 CRUD하고 적절한 이벤트를 등록/해제 할 수 있습니다.\n- 배열과 객체의 메서드 사용에 능숙하며 필요한 데이터를 가공하여 사용 할 수 있습니다.\n- 비동기 처리로 HTTP response를 처리하고 데이터를 추출해 웹페이지에 적용 할 수 있습니다.\n- 클래스와 프로토타입의 차이를 이해하고 사용 할 수 있습니다.\n\n\n### HTML5, CSS3\n- 시멘틱태그를 사용하고 웹표준을 준수하려 노력합니다.\n- canvas와 SVG 요소를 활용할 수 있으며, 라이브러리 없이 transition이나 Keyframe animation 작업을 할 수 있습니다. (슬라이드 캐러셀, 패럴랙스 스크롤)\n- CSS3의 Media Queries, 상대단위 사용, \u003cimg\u003e 태그의 srcset 속성을 숙지하고 있으며 반응형 UI를 만들 수 있습니다.\n- Flexbox, Grid Layout를 사용해 요소의 배치 및 정렬할 수 있습니다.\n- Transitions 및 Animations으로 요소의 상태 변화를 부드럽게 처리하고 애니메이션을 만들 수 있습니다.\n- Custom Properties (Variables)로 사용자 정의 변수를 사용하여 CSS에서 값을 재사용하고 관리합니다.\n\n### NextJS \n- Hydration을 이해하고 SSR과 SSG를 구현 할 수 있습니다.\n- 세그먼트 단위의 URL Path 구조를 이해하고 동적으로 세그먼트 값을 사용하여 라우팅을 할 수 있습니다.\n\n### React\n- React hooks을 사용 할 수 있으며 custom hook으로 무한 스크롤 기능을 모듈화해 사용한 경험이 있습니다.\n- Redux, Recoil을 이용한 전역 상태를 관리 할 수 있습니다.\n- 함수형 컴포넌트에 능숙합니다.\n\n\n\n\n\u003cbr/\u003e\n\u003cbr/\u003e\n\n\n# 포트폴리오 링크\n 각 프로젝트의 제목을 클릭해 해당 프로젝트의 **Readme**를 확인 할 수 있습니다 _:D_\n \n\u003cbr/\u003e\n\n## 1. ONSPLASH (무한스크롤 이미지피드 사이트)\n\n![image](https://github.com/user-attachments/assets/d43fc3e9-934a-4811-a706-fe4a0e3dfc67)\n\n\n\n\u003cbr/\u003e\n\n## [배포 주소(https://on-splash.vercel.app/)](https://on-splash.vercel.app/)\n\n#### [저장소 repository](https://github.com/toa-web-dev/OnSplash)\n\n#### 이미지 API를 활용한 이미지 피드 웹 프로젝트입니다.\n#### vercel을 사용해 CI/CD 파이프라인을 구축하였습니다. \n- 비동기 처리로 서버에서 응답 받은 JSON 데이터를 가공\n- Intersection Observer API로 무한 스크롤링\n- 이미지 로딩 시 스켈레톤 로더 구현\n- 뷰포트 너비에 따라 적응형 UI 구현\n  \n\u003cbr/\u003e\n \u003cbr/\u003e\n  \n## 2. Photoswipe\n\n **틴더라이크 이미지 스와이프 프로젝트** \n\n  [lorem picsum](https://picsum.photos/)와 API 통신하며, 사진이 담긴 카드를 넘기며 좋고 싫음을 나타낼 수 있는 프로젝트입니다.\n \u003cimg src=\"https://github.com/toa-web-dev/toa-web-dev/assets/85207564/0800c402-fa58-46ee-a2da-0c15cf62c93e\" width=\"400\" height=\"400\"/\u003e\n\n## [배포 주소(https://photoswipe-agl3a4eeo-toas-projects.vercel.app/)](https://photoswipe-agl3a4eeo-toas-projects.vercel.app/)\n\n#### [저장소 repository](https://github.com/toa-web-dev/Photoswipe)\n\n \n \u003cbr/\u003e\n \u003cbr/\u003e\n\n## 3. Graphify_dev_note (블로깅 프로젝트)\n\n\u003e **문서 관계 시각화 프로젝트**\n\u003e\n\u003e 개발 학습을 위해 블로깅하는 문서를 네트워크 그래프로 **시각화**하여 개념을 정리하고 다른 내용과의 연관성을 쉽게 확인 할 수 있는 프로젝트입니다.\n\n\u003cimg src=\"https://github.com/toa-web-dev/toa-web-dev/assets/85207564/9157830b-1a96-484b-8347-e6f4b21445e7\" width=\"800\" height=\"400\"/\u003e\n\n## [배포 주소(https://graphify-dev-note.vercel.app/)](https://graphify-dev-note.vercel.app/)\n\n#### [저장소 repository](https://github.com/toa-web-dev/Graphify_dev_note)\n\n \u003cbr/\u003e\n\n\n\n### 애용하는 레퍼런스\n- 코어 자바스크립트 도서\n- [MDN web Docs](https://developer.mozilla.org/ko/)\n- [자바스크립트 기본](https://ko.javascript.info/first-steps)\n\n\n\n\n\n\u003c!--\n\u003cbr/\u003e\n \u003cbr/\u003e\n\n# 4. [웹 개발 회고록](https://github.com/toa-web-dev/toa_web_notebook)\n\n **웹 개발 중 학습한 내용을 회고하는 내용을 담고 있습니다.**\n - 각 스니펫 별로 readme.md에 회고를 작성했습니다.\n - 단순 코드 업로드가 아닌 학습하고 내 것으로 만드는 것에 중점을 두고 있습니다. :)\n\n\u003cbr/\u003e\n\n#  현재 아래의 프로젝트는 서버를 복구할 수 없어 이상 정상적인 작동이 불가능한 점 양해 부탁드립니다.\n\u003cbr/\u003e\n\u003cbr/\u003e\n\n\n\n\u003cbr/\u003e\n\n\n## 3. [Leisure-Link-Plus](https://github.com/toa-web-dev/Leisure-Link-Plus)\n\n\u003e **무한스크롤 이미지 피드가 있는 여행지 사진 공유 웹사이트**\n\u003e\n\u003e 팀 프로젝트로 진행한 여행지 사진을 공유하는 웹 서비스를 개선한 `회고 프로젝트`입니다.\n\n\u003cbr/\u003e\n--\u003e\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftoa-web-dev%2Ftoa-web-dev","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftoa-web-dev%2Ftoa-web-dev","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftoa-web-dev%2Ftoa-web-dev/lists"}