개발하자

최근에 다시 Groo에 신경 써서 열심히 코딩을 하고 있었다. Groo는 DB를 따로 사용하지 않고 localstorage를 이용해서 데이터를 저장하고, 업데이트 하고 있다. Groo의 메인 컨셉이 오늘 실천한 행동 버튼을 선택하고 물을 주면 나무가 자라나는 컨셉이다. 양동이 버튼을 누르면 tree 와 관련된 데이터가 변경된다. tree 는 groo, watering, cnt 프로퍼티를 가지고 있다. groo: 현재 몇 그루의 나무를 키웠는지 저장 watering: 현재 나무에 물을 얼마나 주었는지 저장 cnt: 몇개의 행동을 실천했는지 저장 그리고 watering과 cnt를 계산하여 groo 프로퍼티를 성장하게 할 수 있도록 했다. 근데 여기서 문제가 발생했다!!! 양동이 버튼을 눌렀을 때 sideba..

기존 프론트 구조 - 함수만을 이용 - 페이지마다 html 파일을 두고 새로운 페이지를 렌더링 하도록 구현 - localStorage에 필요한 정보를 모두 저장해두고 있음 발생한 문제 - 중복되는 기능이 있는 함수를 페이지마다 만들어야 함 - 마크업에 있는 태그가 아니라면 오류가 발생함 (당연하지만,,, ) -> 이거 때문에 중복이 더 많아짐 -> 해결방법이 있을 것 같은데 내가 못 찾는 느낌!! (이것도 찾아봐야겠다) 변경한 프론트 구조 - 클래스를 이용 - SPA 구현 ( data-href 라는 옵션을 태그에 추가해서 구별할 수 있도록) - 페이지 별로 클래스를 생성 - habit, user, comment 클래스를 생성해서 각 기능별로 load, save 기능을 수행할 수 있도록 함 클래스로 변경하..

1. responsible web 구현 - 현재 html 구조화와 css 실력이 부족하기 때문에 이 프로젝트르 하면서 실력을 늘리고 싶음 - 요즘 반응형 웹이 아닌 것이 없기 때문에 공부가 무조건 필요함 2. spa vanilla.js로 구현 - 프레임워크(react.js, vue.js)를 배워서 바로 써볼 수도 있지만 근본인 vanilla.js를 이용해서 spa를 먼저 만들어 보는 것이 javascript를 좀 더 깊게 이해할 수 있을 것이라고 생각함 3. class의 필요성 깨닫기 - 글로 이해하는 것과 실제로 해보면서 이해하는 것에는 큰 차이가 있다고 생각하기 때문에 직접 구현하면서 차이를 느끼는 것이 목표 - 함수로 처음에 프로젝트를 만들고 이후에 spa를 구현하면서 class로 변경할 예정 3...

Groo란? : 환경 문제에 관심을 가지고 실생활에서 실천 하고 싶어하는 사람들을 위한 웹사이트이다. : 주요한 컨셉은 스스로 지키고 싶은 습관의 목록을 정하고, 그것을 지킴으로써 한그루의 나무에 물을 주는 것이다. Groo의 주요 기능 지키고 싶은 습관의 목록을 스스로 생성, 삭제 할 수 있다. 다짐을 작성하여 매일 스스로를 독려하도록 한다. 습관 목록에서 지킨것을 선택하여 나무에 물을 주고, 나무는 자란다. 지금까지 몇 번의 물을 줬는지 알 수 있다. 지금까지 몇그루의 나무를 길렀는지 알 수 있다. 당신이 하고 있는 선한 영향력을 공유 할 수 있다. 환경과 관련된 피드를 볼 수 있다. Groo에 사용 될 기술 Back-end Node.js Express.js Front-end vanilla.js SP..