웹프로그래밍
myFtp - 개발 1일차
조영재님
2018. 4. 6. 23:48
오늘 한 일
1. 기획
처음에 기획없이 막무가내로 '틀만 짜자!' 이런 생각으로 키보드를 두드렸다. 하지만 열심히 두드리는 것도 잠시, 금방 무엇을 해야할지 갈피를 잡지 못했다. 이로 인해 기획의 소중함을 깨달았고, 30분정도 투자하여 간단하게나마 그림을 그리고나니 무엇을 해야할지 명확하게 알 수 있었다.
2. 컴포넌트 생성
기획을 바탕으로 컴포넌트와 라우터를 한 번에 생성했다. 하나의 컴포넌트를 작성하고, 다른 컴포넌트가 필요할 때에 생성했던 지난 프로젝트와는 사뭇 다른 느낌이며, 훨씬 깔끔하게 일이 진행되는 기분이다.
3. 이미지 업로드
여태까지 Angular를 계속해서 다뤄왔음에도 불구하고, 초반에 이미지를 몇 번 띄우려고 시도하다가 포기했다. 자꾸 엑박만 떠서...
하지만 구글링은 역시 훌륭했다. 전에도 구글링을 했는데 왜 찾지 못했을까? 나의 구글링 실력이 조금 늘긴 했나보다.
Angular는 asset이라는 폴더에서 정적파일을 취급한다. 그리하여 이미지파일을 asset/image/1.jpg 의 경로로 삽입한 결과, 깔끔하게 올릴 수 있었다.
4. 레이아웃
ngFor을 이용하여 이미지의 개수만큼 반복하여 올릴 생각인데, 이것이 bootstrap의 row, col 레이아웃과 잘 맞지 않았다. 내 생각이 부족한건지 잘 모르겠지만 한 줄에 3개씩 끊어서 올리고자 하는데 이러려면 row하나에 이미지 3개가 들어가고 row를 다시 생성해야한다. 이렇게 ngFor를 사용하려면 row에 ngFor을 사용하되, 배열의 한 인덱스에 3개의 이미지이름이 들어가야한다. 이렇게 배열을 재생성하는 방법은 비효율적이라고 생각하여, 일단은 크기에 따른 줄바꿈으로 레이아웃이 짜여지게 생성했다.
5. FTP
전에는 막연히 프로토콜이라고만 알고있었는데, 파일 전송 프로토콜이라는 사실을 명확히 알게되고, 어떤 방식으로 이용되는지도 이해했다.
6. 모듈
FTP를 구현 할 방법을 생각해보았는데, 제일 첫번째가 이와 관련된 모듈이 있지않을까? 였다. 소켓프로그래밍이나 I/O를 능숙히 못다뤄서... 이게 아니면 엄청 어려울거라 생각했다. 아니나 다를까 nodejs ftp 를 검색하자 마자 기다렸다는 듯이 npm의 ftp모듈에 대한 설명이 나타났다. 있을거라 생각은 했지만 이렇게 쉽게 나타나니까 무척 신기했다.
내일 할 일
1. npm ftp 모듈 이해
2. setting 컴포넌트 구성
3. user, _img 클래스 생성