고양이 사진첩!

간단한 설명

OS의 파일 탐색기를 웹 브라우저에서 구현

데모 👀

https://95rolancia.github.io/cats-gallery-javascript

구조

├── public
├── src
│   ├── api
│   │   └──  api.js
│   ├── components
│   │   ├──  app.js
│   │   ├──  breadcrumb.js
│   │   ├──  imageview.js
│   │   └──  nodes.js
│   ├── styles
│   │   ├──  auth_service.js
│   │   ├──  card_repository.js
│   │   ├──  firebase.js
│   │   └──  image_uploader.js
│   └── utils
│       └──  loading.js
├── index.js
├── index.html
└── README.md

기술 스택

• HTML
• CSS
• JavaScript

기능

• 폴더 클릭 시 폴더로 들어가기
• 파일 클릭 시 파일 보여주기
• 로딩
• 주소창 클릭 시에도 이동

소감

이 문제는 프로그래머스 과제관에 있는 고양이 사진첩 문제입니다.

프로젝트를 진행하면서 명령적 프로그래밍, 선언적 프로그래밍에 대해 곱씹게 되었으며 component 단위로 구현함으로써 React와 같은 라이브러리를 사용하는 이유도 조금이나마 알게되었습니다.