시작하며
워드프레스로 블로그나 개발 프로그램 배포 사이트로 사용도 하고, 업무 활용 프로그램을 꽤 만든 것 같다.
이런 N100 미니 PC와 함께 라즈베리파이 5도 지난달 모셔오며 생각지도 않던 기능이 필요하게 되었다.
N100 미니 PC에는 Anydesk를 설치하여 파일 전송도 가능하다. 그런데, 라즈베리 파이에는 RealVNC로 원격 연결하고 있는데, 요 녀석은 파일전송기능은 제공하지 않는다. 그렇다고 SFTP를 구동하자니 마음이 안 간다.
대안으로는 워드프레스의 플러그인을 이용하는 방법도 있지만 여러 명이 이용할 경우 유료 결제를 해야 해서 일단 패스했다. 혼자만 사용하면 문제없지만, 소규모 인원이 파일 서버 대용으로 사용하는 걸 고려하니 웹 인터페이스가 지원되는 파일 서버가 어울릴 것 같았다.
내가 운영하는 서버들은 대부분 PHP와 Python으로 구동이 가능하고 이중 Python Base의 Flask로 만들기로 한다.
솔직히 Flask로 만들면 손이 더 많이 간다. 특히 Python으로 잘 만들어 놓고 웹서버 통신을 위해 Gunicorn과 같은 WSGI 서버 연동하다 보면 사소한 실수로 반나절을 홀랑 까먹을 때도 종종 있었다.
| Flask 환경 구축 및 개발 –> Gunicorn 연동 (Service등록) –> Nginx 설정 |
반면, PHP로 작업을 하게되면 홈 디렉토리안만 올려 놓으면 별도의 연동 작업을 하지 않아도되니 참 편하긴 한데 이상하게 Python에 손이 간다.
PHP에 주력 할 때가 버전 4.x였고, 지금은 8.x까지 나왔다지만 아마도 예전 보안 취약성이 머릿속 어딘가에 남아 기피하는거 아닌가도 싶지만 개발은 빨리 해놓고 연동에서 늘 애먹는거 보면 마냥 Flask에 미소를 지을 순 없다.
컨셉
아주 간단하다. 관리자와 일반 유저가 파일을 올리고 다운로드할 수 있고, 이런 파일이나 폴더에 대한 삭제가 가능한 웹인터페이스를 갖춘 파일 관리 프로그램이다.
처음엔 React와 같은 프레임워크를 이용하여 탐색기와 같은 UI 형태로 웹이란 느낌보단 프로그램이란 느낌으로 만들어볼까도 생각했는데, 역시 리액트나 Next.js, 스벨트와 같은 프레임워크는 마치 해외여행 가서 먹는 외국 음식 느낌이 든다. 고로 만들 땐 신나지만 익숙하지 않아 나중에 유지보수가 힘들다는 게 느껴졌다.
프로그램 제작 전 아래와 같은 형태로 기능을 정리했었다.
사용자 인증 및 권한 관리:
- 로그인/로그아웃 기능
- 관리자/일반 사용자 구분
- 사용자별 파일 접근 권한 관리
파일 관리 기능:
- 파일/폴더 생성, 삭제, 이름 변경, 이동
- 파일 업로드 및 다운로드
- 파일 목록 표시 및 브라우징
관리자 기능:
- 사용자 계정 관리 (생성, 삭제, 권한 변경)
- 전체 파일 시스템 접근 및 관리
보안:
- 비밀번호 해싱
- 사용자별 접근 제어
- CSRF 보호
사용자 인터페이스:
- 반응형 디자인
- 직관적인 파일 관리 인터페이스
- 에러 메시지 및 알림 표시
로깅 및 에러 처리:
- 애플리케이션 로그 기록
- 사용자 친화적인 에러 페이지
위와 같이 나열하고 만들다 보니 아래와 같은 파일들로 구성되었다.
평상시 python파일은 2~3개 내외로 작업했지만 이번엔 기능 구분을 위해 여러 개의 파이썬 파일들을 만들게 되었다.
PyManager
파일별 특징은 아래와 같다.
Python 파일:
- config.py: 애플리케이션 설정 (데이터베이스 URL, 시크릿 키 등)
- wsgi.py: WSGI 애플리케이션 진입점
- init.py: Flask 앱 초기화, 블루프린트 등록, 로깅 설정
- admin.py: 관리자 기능 (사용자 생성, 삭제, 권한 변경)
- auth.py: 인증 관련 기능 (로그인, 로그아웃, 회원가입)
- models.py: 데이터베이스 모델 (User 클래스)
- utils.py: 파일 관리 유틸리티 함수
- view.py: 메인 애플리케이션 로직 (파일 관리 기능)
HTML 템플릿:
- base.html: 기본 레이아웃 템플릿
- file_manager.html: 파일 관리 메인 페이지
- login.html: 로그인 페이지
- admin.html: 관리자 패널
- 404.html, 500.html: 에러 페이지
CSS 파일:
- style.css: 메인 스타일시트
- login.css: 로그인 페이지 스타일
- admin.css: 관리자 패널 스타일
JavaScript 파일:
- main.js: 메인 JavaScript 파일 (파일 관리 기능)
- file_manager.js: 파일 관리 관련 추가 기능
- login.js: 로그인 페이지 기능
페이지 구성은 아주 단순하다.
로그인 –> 파일 관리 –> 관리자
관리자가 직접 사용자를 만들도록 하여 가입 링크 같은 건 없다.
윈도우 탐색기 느낌 나게 하려 했는데 이건 차차 수정해야겠다. 일단은 기본 기능 구현하고 사용하며 개선해 가려한다.
관리자 페이지도 심플하게 만들었다. 역시 개선할 인터페이스들이 눈에 들어오지만 당장 기능 활용이 우선이라 생각해 현재 상태에서 1차 릴리즈를 했다.
앞으로 추가할 기능은 아래와 같이 정리해보았다.
- 인터페이스 개선
- 파일관리 페이지의 탐색기화
- 관리자 페이지의 사용자 친화적 UI와 인터페이스
- 파일공유 기능 및 검색 기능
- 공유 링크 생성과 기간, 권한 설정 기능
- 사용자 간 파일 공유
- API개발로 외부 서비스 연동
- RESTful API 제공을 통해 외부 서비스 연동
- 보안강화
- 2단계 인증
- 파일 암호화
대략 위와 같다.
지금 이 글을 쓰는 서버에서 개발하고 라즈베리파이 5에도 이식하여 구동해 보았다.
역시 잘 동작한다.
마치며
pymanager를 만들기 전에 관련 프로그램들을 찾아보았었다. PHP기반의 FileGator가 그나마 눈에 띄긴 했는데 내가 뭘 잘못 세팅 했는지 돌아갈 생각을 해주지 않아 바로 개발에 착수 했었다.
추가 기능이 반영될 때 즘에는 일반 사용자도 쉽게 설치 할 수 있게 설치 파일로 만들어 배포 해야겠다. 뭐 그전에 기능 검증부터 해야되니 공개는 조만간 진행하려 한다.
또 하나의 소소한 프로젝트를 진행하며 찜질방 같은 숨막히 더위를 잠시나마 잊고 한껏 몰입한 것 같다.