늘보 567

독학 어플 개발 day 21

[PWA] Vue.js 프로젝트에 PWA 적용하기 아래 3가지를 충족해야 PWA가 될 수 있다.웹 앱 매니페스트 (Web App Manifest)서비스 워커 (Service Worker)HTTPS 프로토콜Vue 프로젝트가 없다면 Vue CLI를 통해 프로젝트를 생성한다.웹 앱 매니페스트란 앱 velog.io 교재와 위의 링크를 참고하여 몇 가지 추가로 진행하였다. 메니페스트를 개략적으로 만들어놓고 인덱스에 메니페스트 주소 추가 pwa 설치 어떤 부분이 했던 건지 또 어떤 부분이 해도 되는 건지 헷갈린다. npm install - project setup npm run build - compiles and minifies for production 프로젝트 셋업 후 컴파일까지 해주었고 그 결과로 서비스 워..

독학 어플 개발 day 20

오늘부터 프로젝트 개발을 시작하였다. Kotlin 운동앱은 따로 마무리지었다. 하... 갑자기 크롬 팅겨서 다시 작성한다. 우선 Vue 프로젝트를 만들어주었다. 옵션들에 대해 설명하자면, Babel : ES6+ 버전 이상의 자바스크립트나 JSX, 타입스크립트 코드를 하위 버전의 자바스크립트 코드로 변환 시켜 IE나 다른 브라우저에서 동작할 수 있도록 하는 역할을 하는 일종의 컴파일러 같은 개념의 Plugin [Vue.js] 바벨 출처 프론트엔드 개발자를 위한 웹팩 - 인프런 | 강의 1000명이 선택한 웹팩 강의. 새롭게 나온 웹팩 버전에 맞춰 리뉴얼된 강좌입니다. 실습 중심으로 더 쉽게 웹팩을 배워보세요 :), 약 1000명이 be-a-weapon.tistory.com TypeScript : TypeS..

독학 어플 만들기 day 19

오늘은 kotlin 공부를 하였다. 프로젝트를 마무리짓지 못한게 마음에 걸려서 하루 종일 이것만 붙잡고 있었다. 하지만 중간 중간에 많이 놀아서 오늘도 결국 끝내진 못했다. 그래도 영상 4개 분량만이 남았으니까 내일 후딱 마무리할 수 있을 것 같다. 오늘은 BMI 화면을 만드는 부분과 룸 데이터베이스를 사용하는 부분에 대해 학습했다. BMI 화면에서는 첫 번째 스샷에서 보이는 것처럼 라디오 그룹을 활용해 클릭된 옵션에 따라 출력 화면을 다르게 만드는 법에 대해 배웠고 룸 데이터베이스에서는 룸 데이터베이스 라이브러리로 데이터베이스를 만들고 다오를 활용해서 데이터베이스를 관리하는 법에 대해 배웠다. 아래 스샷을 보면 데이터를 쌓고 수정, 삭제하는 기능들이 구현되어 있는 것을 볼 수 있다. 내일 일어나자마자 ..

독학 어플 만들기 day 18

오늘은 짬짬이 Kotlin 강의를 들었다. 앱에 음성 안내를 추가하는 방법과 미디어 플레이어를 추가하는 방법을 배웠다. 리사이클러뷰(RecyclerView)의 개념에 대해서도 학습하였다. 매번 느끼는 거지만 생각보다 더 지치고 생각보다 더 시간이 많이 소요되는 것 같다. 새로운 언어를 배우는 건 쉽지 않은 일이다. 일단 계획을 수정해서 내일까지는 이 운동 어플의 강의를 끝내는 걸로 하고 남아 있는 두 강의 프로젝트를 주 단위로 끊어서 마저 진행하려고 한다. 중요한 건 팀원들하고 같이 진행하는 메인 프로젝트니까 거기에 좀 더 집중할 생각이다. 그 외에도 할일이 몇 가지 있기 때문에 8월은 7월보다도 한층 더 바쁘게 보내게 될 것 같다. 많은 도전들을 목전에 두고 있다. 감사한 마음을 가져야지. 집중해서 차..

독학 어플 만들기 day 17

오늘 먼저 살펴본 것은 푸시알림을 만들고 보내는 방법이다. 실제로 전달되는 메시지에 비해 공정은 복잡하다는 느낌을 받았다. 설정할 수 있는 세부 부분도 많았다. 하지만 푸시 알림이 어플리케이션의 강력한 기능 중 하나이니 어려워도 해야겠지. 컨포넌트 작성이 끝나고 파이어베이스 서버에 함수를 작성하려 했지만... 요금제를 업그레이드 해야 한다길래 스킵하였다. 나중에 필요해질 때 다시 알아보고 해봐야겠다. 저번 일지에서 이번엔 기필코 코드를 실행시키라! 다짐했었는데 안타깝게도 그 다짐은 이루어지지 않았다. 본격적으로 프로젝트에 들어갔을 때 초기 단계에서부터 하나씩 맞춰가는 게 나을 것 같아서 고집부리지 않기로 했다. 다음으로는 Cloud Firestore와 enablePersistence() 함수를 활용해 오..

독학 어플 만들기 day 16

오늘은 실습으로 주어진 프로젝트를 하며 구글이나 다른 매체를 통해 로그인하는 방법에 대해 학습하였다. 그간 마주쳤었던 로그인 페이지들이 이런 식으로 짜여져 있었구나를 알게 되어서 흥미로웠다. 오늘은 일단 에러 메시지를 최대한 처리해서 결과 창을 어떻게든 띄워보려고 했었는데 일정이 있어서 마무리하지 못할 것 같다. 소득은 firebase/app을 임포트 하는 게 아니라 firebase/compat/app을 임포트해야 한다는 것을 알았다는 것! 다음 예제에서는 이런 저런 문제들을 다 해결하고 결과 창을 꼭 띄워봐야지! 마음이 급해져서 이만 줄이겠다. 곧 책을 끝낼 수 있을 것 같고 또 곧 프로젝트 개발에 들어갈 수 있을 것 같다. 화이팅!

독학 어플 만들기 day 13

오늘은 미련이 남아 있던 Kotlin 공부를 더 하였다. 8시간 가량이 소요되는 프로젝트를 마치고 싶었는데 생각보다 학습양이나 습득해야 할 정보의 양이 많다보니 생각만큼 많이 하지 못했다. 스샷의 내용은 운동 자세를 이미지로 보여주고 아래의 30초 간격의 타이머를 설정해 운동을 보조하는 어플리케이션 기능을 구현한 모습이다. 사실 이미 프로젝트도 PWA로 하기로 했고 Kotlin과 Android Studio를 더 배워서 무얼 할지도 모르기 때문에 이 강의를 더 듣는 것이 의미가 있을지는 모르겠다. 그렇지만 어떠한 이유에서건 이미 시작한 일을 끝마치지 못하고 중간에 어정쩡하게 중단하고 싶지는 않았기 때문에 오늘 하루 강의를 나름 열심히 들어보았다. 강의를 다 마치려면 다음주까지 시간을 쪼개서 꾸준히 들어야할..