분류 전체보기(38)
-
electron에서 alert창 사용 시 input focus 잃는 이슈를 모달창으로 해결
외주개발 하면서 별 문제가 아니라고 생각했던 문제가 드디어 직면 했다. 바로 electron에서 input 포커싱을 잃는 큰 문제 였다. 아무리… 찾아 봐도 electron을 한국에서 쓰지 않는지라 관두고 있었는데 영어로 검색하니까 바로 나왔다.. 역시 영어를 배워야 한다.. *추가: electron에는 alert대신 dialog api를 사용해서 해결 할 수 있다. https://www.electronjs.org/docs/latest/api/dialog 관련 이슈 Can't edit input text field after window.alert() Can't edit input text field after window.alert() I've got this Electron app (using Nod..
2023.07.03 -
반응형 페이지 - 모듈화 디자인 하기
모듈화 디자인 반응형 웹 개발의 대세는 페이지 만들기 에서 컴포넌트 만들기로 이동했다. 컴포넌트 기반으로 웹을 제작하면 마치 블록 장난감을 조립하듯 각각의 컴포넌트간 조합을 이용해 화면을 디자인할 수 있다. 모듈화된 디자인은 작업 효율에 많은 도움이 된다. 여러개의 페이지는 각각의 다양한 레이아웃을 가지지만, 페이지를 구성하는 컴포넌트의 형태는 비슷한 경우가 많기 때문에 컴포넌트에 초점을 맞추고 웹을 만들면 일이 줄어들게 된다. 반응형 컴포넌트를 만들고, 그것들을 조립해 하나의 페이지를 만들면 페이지는 자연스럽게 반응형 페이지가 된다. 스타일 재사용이 용이하다. 필요한 경우 추가 스타일을 적용하면 된다. 페이지의 일관성을 유지하기가 용이하다. ResetCSS 웹 브라우저 마다 default 값으로 스타일..
2023.07.02 -
반응형 웹 페이지 - 기초체조하기
반응형 웹페이지란? 다양한 기기나 브라우저 크기에 맞게 구성이나 크기를 변경해가며 반응하는 웹문서 또는 이를 제공해주기 위한 방법이다. 모바일, 데스크톱, 태블릿 등등… 예전에는 도메인을 달리해서 기기에 따른 웹을 제공했다고 합니다. ex) www.naver.com / m.naver.com 이제는 웹의 생태계가 다양한 기기로 한번에 제공하기 위해 반응형 웹페이지를 배우는것은 가히 필수적이라고 할 수 있습니다. 그럼 차근차근 알아 봅시다. 뷰포트 컴퓨터 그래픽스에서, 뷰포트(viewport)는 현재 화면에 보여지고 있는 다각형(보통 직사각형)의 영역입니다. 웹 브라우저에서는 현재 창에서 문서를 볼 수 있는 부분(전체화면이라면 화면 전체)을 말합니다. 뷰포트 바깥의 콘텐츠는 스크롤 하기 전엔 보이지 않습니다..
2023.07.02 -
PWA : 프로그레시브 웹앱
네이티브 앱이란.. 스마트폰 운영체제에서만 작동하는 앱을 말한다. 따라서 운영체제 환경에 맞는 별도의 프로그래밍 언어와 SDK라는 개발 도구를 이용해야 제작할 수 있다. ex) 안드로이드 : 안드로이드 스튜디오, 아이폰 : Xcode 네이티브앱은 일반적으로 개발 난도가 높다. 하지만 카메라, 스피커, GPS, 가속기 처럼 기기에 탑재된 모든 기능을 사용할 수 있다는 것이 장점 네이티브 앱은 전 서계를 시장으로 삼는다. 하지만 업데이트가 필요하면 다시 다운 받아야 한다. 모바일 웹앱 이란… 브라우저로 통신해 운영체제의 한계를 뛰어넘어서 사용자 경험을 똑같이 제공하는 방법. 웹 표준 언어로 만들므로 제작 비용도 저렴하고 개발기간도 짧다. 현재 자신이 사용하는 익숙한 개발언어인 HTML5, CSS3, JS를 ..
2023.06.28 -
개발을 좋아하는 사람인가?
퓨전 재즈 난 지금 유튜브에서 Casiopea- Eyes Of The Mind의 라이브 영상을 보고 있었다. Casiopea는 일본의 대표적인 퓨전 재즈팀인데, 연주곡을 주로 퓨전재즈로 연주하고, 밝고 명쾌한 분위기가 특징이다. 항상 이밴드의 라이브 영상을 보면 진짜 음악을 좋아하는 사람들이란 느낌이 강하게 든다. 연주자 뿐만 아니라 관객석 까지 모두가 Casiopea의 음악을 즐기고 있는 모습이 인상적이다. 가사도 없는 연주곡을 말이다. 음악을 진짜 좋아하는 사람들은 음악의 다양한 면을 보게 된다. 음악의 근본 즉 연주자들의 생각을 엿볼 수 있게 된다. 음악도 하나의 생각 표현 방법이다. 이 음악의 주제에 맞는 연주자들의 생각을 듣는게 재밌다. 이 코드에서 이런 멜로디를 연주하거나, 이런 코드로 각색을..
2023.06.26 -
브라우저에 www.google.com을 입력하게 된다면??
한줄 요약 : 사용자 컴퓨터에서 실행되는 브라우저가 www.google.com 이라는 집주소(IP)를 찾아가서 문서(HTML)를 가져오고, 그 문서를 사용자 모니터에 보여준다. 1. 브라우저 주소창에 www.google.com을 입력한다. 브라우저 창에 주소를 입력해본다. 브라우저 캐시 뒤져보기 브라우저가 google.com의 IP 주소를 찾기 위해 캐시에서 DNS 기록을 확인한다. DNS는 웹사이트의 IP주소와 도메인 주소를 연결해주는 시스템이다. 모든 URL에는 고유한 IP 주소가 할당되어 있다. ( IP 주소 : 각각 컴퓨터의 주소 ) : 000.000.000.000 IP주소는 액세스의 요청 웹사이트의 서버를 호스트하는 컴퓨터에 속한다. 예를 들어,google.com의 IP 주소는 142.250.1..
2023.06.02