반응형 book6 [2nd].05 뷰 고급 기능 익히기 (작성중) HTML에 기반을 둔 커스텀 엘리먼트인 컴포넌트를 제작하고 활용 컴포넌트의 상탯값 관리와 뷰 간의 이동을 도와주는 Vuex와 라우터제공 05-1 복잡한 로직과 computed 속성 computed 속성 : 머스태시를 이용해 HTML 엘리먼트값 변경에 따른 연산 작업지원 - 원본 data를 수정으로 필요성 확인 * 010501 [DoIt!실습] 대문자로 변환하는 프로그램 만들기 - 0105/ex05_01 > computed.html 파일 생성 원본 문장 : "{{ sOriginalMessage }}" 대분자로 변환된 문장 : "{{ fnUpperCaseMsg }}" * 머스태시 사용 : 문자열을 {{}} 로 감싸고 엘리먼트(P) 값 표시 - {{ sOriginalMessage }} : 문자열 변수 대체 -.. 2023. 6. 7. [2nd].04 뷰 기초 쌓기 드디어 뷰다뷰 04-1 뷰, 자바스크립트프레임워크의절대 강자 * 뷰 (Vue.js) - 2013년 출시 : 에반 유(Evan You) 개발 - 자바스크립트 프레임 워크 - 앵귤러, 리액트에서 발견할 수 없는 콤팩트한 프레임워크 제작 - 훌륭한 문서, 제이퀴리를 넘어선 좋은 아이디어 결합 > 뷰 2.0부터 크게 주목 https://ko.vuejs.org/ Vue.js - The Progressive JavaScript Framework | Vue.js 접근성 HTML,CSS, 자바스크립트 표준을 기반으로, 쓰기 편한 API와 최고 수준의 문서를 제공합니다. ko.vuejs.org * 목적 : 인터랙티브 웹 인터페이스를 개발 - 프로그레시브 자바스크립트 프레임워크 - 프로그레시브(progressive) : .. 2023. 5. 9. [1st].03 순수 자바스크립트로 PWA 만들기 * 뷰(Vue.js) : 실글페이지 애플리케이션 (SPA), 리액티브프로그래밍, 데이터바인딩 지원 * 뷰티파이(Vuetify.js) : 구글 머티리얼 디자인 스펙에 맞는 컴포넌트 단 03-1 ‘안녕하세요! PWA by JS’ 구경하기 - 3장에서 작성할 실습 프로젝트 실행 * 010301 [DoIt!실습] ‘안녕하세요! PWA byJS’ 예제 실행하기 - 0103/ex03_01-sample : index.html > 실행 * 매니페스트 등록 확인 - 크롬 개발자도구 > Application > Manifest > Identity > Presentation > Icons * 서비스워크 동작 - 크롬 개발자도구 > Application > Service Worker > Status : 녹색 상태 아이콘 - .. 2023. 5. 9. [1st].02장 모던 자바스크립트 꼭 필요한 것만 배우기 02-1 재활용할 수 있는 블록 함수 - ES6부터 스코프를 고려한 변수 관리기능 강화 및 변수에 함수를 저장하는 함수표현식 추가. 선언식(declaration) : 기존 선언방식 - function 뒤에 함수 이름을 적고 소괄호()안에 필요한 매개변수를 쉼표(,)로 구분해서 작성, 함수가 수행할 명 령을 중괄호 {}로 감싸서 구현 눌러주세요! 3+5 = ? 3 - 5 = ? - document.querySelector('#clickme').innerHTML = '안녕하세요'; > id값이 #clickme 엘리먼트의 내용 설정 - 덧샘결과 반환 함수의 선언식 표현 : fnSayHello - 뺄셈결과 반환 함수의 함수 표현식 : fnMinusNumbers * 실행 * [눌러주세요!] 버튼클릭 - 안녕하세요.. 2023. 3. 28. [1st].01장 헬로! 프로그레시브 웹앱 01-1 프로그레시브 웹앱이 뭐예요? PWA : progressive web app 네이티브앱 : SDK로 개발(안드로이드 스튜디오 : 자바 / 엑스코드 : 오브젝트C, 스위프트) - 운영체제 별 서비스 개발 : 안드로이드, IOS - 배포 : 앱스토어(애플), 플레이 스토어(구글) - 사용 : 스토어에서 다운로드하여 설치 (설치후 알림등의 다양한 기능 활용) > 네이티브앱 장단점 비교표 모바일 웹앱 : 모바일 베이스의 네이티브 앱 - 웹 영역은 HTML5, CSS3, Javascript로 구현 - 웹 영역은 스토어 배포 없이 서버의 컨텐츠 교체 만으로 최신기능 적용 - 인터넷 속도 영향, 네이티브앱에 비해 제한된 기능 > 모바일 웹앱 장단점 비교표 하이브리드 앱 : 네이티브앱과 모바일 웹앱의 장단점 활.. 2023. 1. 25. 프로그레시브웹앱만들기 - intro 출판사 : 이지스 퍼블리싱 저자 : 김응석 발행 : 2020.08.06 페이지 : 576 도서 페이지 : http://www.easyspub.co.kr/20_Menu/BookView/B001/389/PUB Github : https://github.com/codedesign-webapp/pwa-example ISBN : 9791163031765 시작 : 2023.01.25 AS : code-design.web.app@gmail.com / https://code-design.web.app/ * Do it! 스터디룸 카페 : https://cafe.naver.com/doitstudyroom * Do it! 공부단 정보 : https://cafe.naver.com/doitstudyroom/6325 - 신청 :.. 2023. 1. 25. 이전 1 다음 반응형