전체 글

새로운 것을 좋아하는 프론트엔드 개발자 ✨
· 웹
🎉 소개 이번에 프로그레시브 웹 앱(PWA)을 주제로 한 첫 번째 저서, "SNS 앱 예제로 배우는 프로그레시브 웹 앱" 을 출간하게 되어 간략히 소개하려고 한다. 본 블로그에도 프로그레시브 웹 앱에 대해 간략히 알아볼 수 있는 강좌를 작성했었는데, 프로그레시브 웹 앱에 대해 보다 더 다양하고 자세한 내용을 다룰 수 있는 내용을 정리하여 집필하게 되었다. 📖 책 보러 가기 책에 대한 자세한 내용은 아래 온라인 서점에서 확인해볼 수 있다. YES24 교보문고 알라딘 인터파크도서 프로그레시브 웹 앱의 전반적인 내용과 다양한 핵심 기능을 밑바닥부터 구현해보며 한 걸음 더 나아갈 수 있도록 구성되어있다. 오프라인 환경에서 웹 페이지를 사용하거나 게시물에 대한 백그라운드 동기화 작업 수행, 그리고 좋아요 알림 기..
· 웹
이번 포스팅에서는 Safari 14 버전부터 사용 가능하게 될 웹 확장(Web Extension)에 대해 알아보고, 샘플 확장 프로그램을 개발해보고자 한다. 기존 사파리(14버전 미만) 브라우저에서도 확장 프로그램을 사용할 수 있었지만, 스위프트로 개발된 네이티브 앱을 별도로 설치하고 활성화하는 방식으로 사용한다는 불편함이 있었다. (접근성도 좋지 않았다) 하지만 곧 업데이트될 사파리 14 버전부터는 구글 크롬 브라우저와 같이 자바스크립트로 웹 확장을 개발할 수 있게 되는데, 웹 개발 모델을 따르고, 웹 확장을 지원하는 다른 브라우저와의 호환성도 유지하기 때문에 사파리 웹 확장을 개발한 후 다른 브라우저에서도 동일한 확장 기능을 사용할 수 있을 것으로 보인다. 본 포스팅을 본격적으로 시작하기에 앞서 함께..
· 기타
안녕하세요 전 세계 개발자가 열광하는 애플의 WWDC 2020를 통해 맥OS의 새로운 버전이 발표되었습니다. 이번 맥의 이름은 Big Sur(빅서) 입니다. 예상과 달리 macOS 10.16 버전이 아닌 macOS 11로 변경 되었습니다. 전체적인 디자인이 iOS/iPadOS와 비슷하게 변경되었으며, 사파리 브라우저 성능 개선과 자체 개인정보/보안이 강화되었다고 합니다. 눈에 띄게 확 달라진 기능은 없지만, 디자인이 거의 새롭게 개편되었습니다. 아마 아이폰이나 아이패드를 사용하고 있다면 비슷하게 바뀌었다는 느낌을 받을 수 있을텐데요, 앞으로 출시할 맥은 ARM 기반의 애플 자체 칩셋을 탑재할 것이라고 발표했기 때문에, 어느정도 통일성을 유지하기 위함이라고 볼 수 있을 것 같습니다. 상세한 변경 사항은 다..
안녕하세요! 이번 포스팅에서는 이후 Vue.js 3 버전에서 추가될 Composition API에 대해 알아보도록 하겠습니다. 지금의 Vue.js는 2.6.11 버전이며 3버전을 향해가고 있습니다. 컴포지션 API(Composition API)가 등장한다는 소식에 많은 관심을 받았었는데요, 어떤 내용인지 한 번 알아봅시다. 1. 개발환경 준비하기 [사전 요구 사항] - Node.js (with NPM) - Vue CLI 지금의 Vue.js는 2.x 버전에 머물러 있기 때문에 컴포지션 API를 사용할 수 없습니다. 하지만, 플러그인을 통해 Vue.js 3에 추가될 컴포지션 API를 사용할 수 있습니다. https://github.com/vuejs/composition-api vuejs/composition..
이번 글에서는 자바스크립트의 self 에 대해 알아보려고 한다. this는 많이 접해보았을텐데 self 는 다소 생소할 수 있다. 이번 글을 통해 self가 무엇인지 한 번 알아보도록 하자. 1. self란 무엇인가? w3c의 문서를 확인해보면, self는 읽기 전용 속성이며 WindowProxy로서의 window 자신을 반환한다고 한다. 꽤 난해한 설명인데 WindowProxy는 또 무엇인지 궁금해 할 수 있다. WindowProxy는 브라우징 컨텍스트와 관련되어있는 주제이므로추후 다른 글에서 자세히 알아보도록 하고, 지금은 단순히 전역 객체인 window 객체 자체를 반환한다고 이해하면 된다. self는 결국 전역 객체인 window를 반환하는 속성이다. self가 this와 같은 키워드라고 오해할 ..
안녕하세요 이번 포스팅에서는 드디어 맥북프로 개봉기를 작성하려고 합니다~ 기존에 사용하던 노트북은 거의 4년 전 쯤 구매한 Acer의 노트북을 사용중이었습니다. i5-7500u, 8GB 램, 250GB SSD의 스펙이었으며 당시 75만원 가량에 구매했습니다. (현재 구매한 맥북과 큰 스펙 차이가 없지만 가격은 3배 더 주고 샀습니다) 자 그럼 간단한 개봉기를 시작해보도록 하겠습니다. 총알을 장전하고... 바로 구매를 했습니다. 2019년형 맥북 프로 고급형 모델에 16GB 램으로 업그레이드를 진행했습니다. + 영문 키보드 고급형에 램 업그레이드를 진행하니 280정도 나오더군요;; 바로 학생할인 박아서 264만원에 결제했습니다. 사실 2018년형이랑 큰 성능 차이도 없고, 외형도 동일해서 고민을 많이 했습..
안녕하세요 이번 포스팅에서는 매직 키보드 2세대 개봉기를 작성할까 합니다! 아이패드 키보드를 알아보던 중 곧 도착할 맥북 프로도 생각하니 매직키보드가 제일 나을 것 같아서 구매를 하게 됬습니다! 1세대는 건전지를 교체해줘야 했는데 2세대는 충전식으로 바뀌게 되면서 많은 유저들이 2세대로 갈아탔다고 합니다. 저는 선택권 없이 2세대로 사버렸지만 1세대가 있었어도 2세대를 샀을거에요 (??) 박스 정면샷입니다. 누가봐도 키보드가 들어있네요 매직키보드는 구매한지 3일도 안지나서 매우 따끈따끈합니다. 2019년 7월에 제조되었네요 박스 내부를 옆으로 밀면 스윽 하고 열립니다 저는 한글 각인이 없는 영문 버전으로 구매했습니다. 전체 구성품은 위와 같습니다. 키보드 본체 라이트닝 케이블 설명서 및 보증서 그냥 찍었..
안녕하세요! 이번 포스팅에서는 애플 펜슬 1세대 개봉기를 작성할까 합니다~ 아이패드 6세대 사용할땐 펜슬을 구매할 마음이 없었으나 미니5를 데리고 온 후 마음이 바뀌게 되었네요.. 간단한 개봉기를 작성해보도록 하겠습니다! 애플 펜슬의 박스입니다. 증말 깔끔하네요 박스 뒷면. 아이패드 프로, 아이패드 6세대 지원이라고 적혀있으나, 이번에 새로 출시한 아이패드 에어와 미니도 지원합니다. 스스슥 박스를 열어보면 안봐도 뻔할 설명서 및 보증서가 있을테고 그 아래에는 펜슬이 있을겁니다. 짠 매끈한 애플 펜슬이 보이네요 박스에서 처음으로 저를 반겨준 친구는 설명서와 보증서 그리고 변환잭, 여분의 펜촉이 하나 들어있습니다 애플펜슬의 펜촉은 소모품입니다 오래 쓰다보면 끝 부분이 닳아서 인식이 안되거나 오작동하는 경우가..
안녕하세요~ 이번에 소개할 제품은 아이패드 미니 5세대 입니다! 기존 4세대와 비교해보면 엄청한 개선사항을 적용하여 등장했죠 미니임에도 불구하고 프로에 버금가는 A12를 탑재하여 정말 빠른 속도를 자랑합니다 디스플레이도 트루톤을 지원하며 라미네이팅 처리까지 되어있기 때문에 미니답지 않은 모습을 확인하실 수 있습니다. 심지어 애플펜슬도 지원!! 이건 꼭 사야돼 구매한지는 꽤 지났지만 그때 그 시절을 떠올리며 간단히 작성해보도록 하겠습니다 아이패드 미니가 담긴 박스입니다. 애플의 박스는 항상 저를 설레게 합니다 뒷모습입니다. 저는 64GB WiFi 모델을 구매했습니다. 박스를 개봉하면 아이패드가 정면을 보고 누워있습니다. 아이패드 뒤에는 라이트닝 케이블과 설명서 및 보증서가 있습니다. 전체 구성품은 위와 같..
안녕하세요! 애플 제품 리뷰는 이번이 처음인 것 같네요~ 첫 번째로 리뷰할 제품은 "에어팟 2세대" 입니다! 본격적인 개봉기 작성에 앞서 필자 본인은 사진을 드럽게 못찍었기 때문에 미리 양해의 말씀 드립니다. 저는 기존에 에어팟 1세대를 10개월 가량 사용했던 유저입니다. 에어팟 2세대를 구매하게 된 이유는 기기간의 전환 속도 개선과 미미하지만 Latency가 조금 줄었다고 해서 구매를 결심하게 되었습니다. 에어팟 박스는 전혀 변한것이 없습니다. 에어팟 1세대가 오래되서 누렇게 변한것 빼고 구성품은 기존의 1세대와 동일합니다. 모두 꺼내서 마구 어질러보면, 박스를 열자마자 저를 반겨준 설명서와 보증서가 담긴 종이봉투가 있습니다. 그 뒤에는 오늘의 주인공인 에어팟이 있구요 이제 상자는 버리시면 됩니다. 사..
이근둥
근둥이의 블로그