본문 바로가기

개발일지

(104)
CSS Horizon&Vertical rendering (수평 수직 정렬 CSS) 20180105 날짜 : 2018. 01. 05.(금) CSS Horizon&Vertical rendering 생각하게 된 계기 새로운 프로젝트를 시작하였다. 간단한 것을 쉬운것 부터 시작하여 적용해보고 싶은것을 모두 적용하는 것이 목표이다. 자세한 것은 해당 프로젝트에... 만난 문제는 CSS에서 수직, 수평 정렬을 하는 것이다. 해결한 내용 이전에 해결한 방법 psd 혹은 sketchapp 파일의 UI가이드 그대로 수치를 넣는다. 장점 : 만들기는 쉽다. 단점 : 브라우저 크기에 따라 반응을 할 수 없다. 금번에 작업한 방법 poiemaweb 에서 내용을 보고 따라하였음. x, y 축으로 비율계산을 하여 움직이는 방법. 장점 : 브라우저 호환성은 좋다. 브라우저 크기에 반응을 한다. 단점 : CSS ..
지금 내가 해야하는 것? (성장에 대한 고민) 20180104 날짜 : 2018. 01. 04.(목) 지금 내가 해야하는 것? (성장에 대한 고민) 본문 알고 있는 것이 아니라 숙달할 수 있어야 한다. 대학교를 졸업을 할 때에도, 다시 프로그래밍을 한다고 생각을 했을때 해야 한다고 생각한 것이 잘 아는 것이 아니라 숙달을 할 수 있어야 한다는 것이였다. 결과적으로는 작년에는 숙달하기 보다는 다양하게 해보게 되었다. (퍼블리싱작업, React 개인프로젝트, 교육기관 과제 수행) 개인 프로젝트를 할때에만에도 '나는 충분히 숙달 되었어'라는 생각 보다는. 이것을 할 줄 알아야 한다는 생각이 더 앞선것 같았다. (모든 채용공고 JobDescription에는 Angular, React가 적혀있었기 때문이다.) 힘겹게 React프로젝트를 마무리 지으니 생각이 ..
웹 사이트 설계 도구 20180103 날짜 : 2018. 01. 02.(화) 웹 사이트 설계 도구 본문 생각하게 된 계기 앞선 프로젝트에서 문제점 중 UI가이드가 부실한 점 인터랙션을 디자인 단계에서 UI가이드 단계에서 설계를 하면 코딩시 손이 안 꼬일것 같음. 알게 된 것. 웹디자인 기획 용어부터 알고 있지 못하였다. 웹이란 짧은 역사를 가졌지만 폭발적으로 발전해 왔다는 것을 인지하지 못했다. 간단히 sketchapp을 사용 할때에는 진정한 이 도구의 목적을 알지 못하였다. 웹 기획 단계(?) wireframe, mockup : 정적 화면 기획 prototype : 인터랙션 + wireframe, mockup storyboard : 정책, 프로세스 + prototype sketchapp을 기준으로 설명 sketchapp 은..
2017년 하루 늦은 연말정산 20180101 날짜 : 2018. 01. 01.(월) 2017년 하루 늦은 연말 정산 목차 취업 블로깅 Github 트렐로(월별 목표관리) 1. 취업 결론은 실패를 하였다. 취업을 진행하면서 알게 된것은 직무에 대한 더 세분화된 기술들과 업무의 내용이다. 사전에 준비한 내용만으로 취업을 지원하게 되어 다른 사람들에 비해 채용의 메리트가 없음. 준비가 되면 취업을 하는 것이 아니라, 취업이 될때까지 지원을 하고 취업이 된 후에도 자기 개발을 한다. 1년 동안 본것은 준비가 된 사람이 기회를 얻는 것이 아니라, 기회를 얻어서 결과를 만들어 낸 것이였다. 그동안 실패하는 것에 무서워서 시도조차 못해본 것 같다. 그리고 취업이 된 후에도 자신의 인생 목표를 수립하고서 계속 앞으로 나아가는 사람들을 만나왔다. ..
프로젝트 결산, 앞으로 하고 싶은 프로젝트 조사 20171228 날짜 : 2017. 12. 28.(목) 프로젝트 결산, 앞으로 하고 싶은 프로젝트 조사 목차 프로젝트 관련 내용 기술적, 비기술적 알게된 것들 다음 프로젝트 관련 내용 1. 프로젝트 관련 내용 프로젝트 개요 : LoL에서 캐릭터 스탯이 좋은 캐릭을 찾고, 비교하는 어플리케이션 동기 및 목표 관심있는 분야에 대해서 어플리케이션을 만들기 React 사용해 보기 (학습이 아니었음) D3를 사용해서 수려하게 보이기 (실패) 실제 커뮤니티 사이트에 공개하기 기술 스펙 배포 : Heroku(PHP) 화면 : React + WebPack + ES6(babel) 툴 : git&Github + sublime 기간별 한일 작업내용 전체 작업수 수행 작업수 작업시간 특이사항 S1 설계 및 필요지식 습득 4 ..
웹 어플리케이션 설계 느낀점. (왜 설계에 관한 자료는 없지?) 20171227 날짜 : 2017. 12. 26.(화) 웹 어플리케이션 설계 느낀점. (왜 설계에 관한 자료는 없지?) 1. 생각하게 된 동기 계획한 프로젝트를 마무리 하였다. 오늘 작업을 하면서 생각난것을 다음번에는 어떻게 하면 피해갈 수 있을까? 프로젝트 결과물 링크 2. 생각한 내용 (스프레드시트, 슬라이드)설계서는 부족하였다. 스프레드시트와, 슬라이드를 이용하여 기능과 화면을 정리하였다. 실제화면은 비슷하게 만들기 쉽지만, 해당 인터랙티브(이벤트)의 경우 설계서에 적지를 않아서 임기응변으로 만들기 일쑤였다. 현재의 도구 만으로는 인터랙티브 화면을 나타내기는 힘이 들며, 시간이 많이 들어도 설계서만 잘 만들면 나머지 작업은 쉬운것을 이해 하게 되었다. 사람은 코드를 기억하지 못한다. 테스트코드가 필..
잘못을 인지 하는 방법은 없을까? (react에서 cookie 사용 삽질기) 20171226 날짜 : 2017. 12. 26.(화) 잘못을 인지 하는 방법은 없을까? (react에서 cookie 사용 삽질기) 1. 생각하게 된 동기 React 에서 cookie를 이용하여 이력기록 그런데 사용이 되지 않는다?! 2. 생각한 내용 결론을 먼저 말하면 오타였다. 'document.cookies'에 입력을 하려고 한것 같다. error문이 발생을 하였는데... sublime에서는 ... 그것을 모르고서 삽질을 진행하였다. react-cookie 라이브러리를 사용할려고 하였다. 예제에서는 서버쪽 구성까지 하여서 사용을 하였지만, static페이지에서 동작이 될거라 생각을 하였다. 사용은 되지 않았으며, 'create-react-app'을 사용하여 간단한 페이지에도 적용하였지만 작동하지 않..
HTML5 쿠키, 세션스토리지, 로컬스토리지 20171221 날짜 : 2017. 12. 21.(목) HTML5 쿠키, 세션스토리지, 로컬스토리지 1. 생각하게 된 동기 검색이력을 화면에서 보여주고 싶었다. 검색을 하니 무언가가 나오는데, 어느것을 사용해야 할까? 사실은 자동완성이 먼저였지만, 대부분 백엔드를 구현한 ajax통신 뿐이여서.... 2. 생각한 내용 summary 구분 쿠키 세션스토리지 로컬스토리지 용량 4Kb 디바이스별, 브러우저별 상이(1Mb이상) 만료 expire 설정별 다름 브러우저 종료시 지속 서버와통신 Header에 포함 통신하지 않음 쿠기 나오게 된 계기 HTTP protocol의 특성에 따라 서버와 연결을 유지 하지않고 (connectionless), 상태값도 가지지 않는다.(stateless) 홈페이지에 로그인 후 CRU..