분류 전체보기(42)
-
반응형 웹 페이지 - 기초체조하기
반응형 웹페이지란? 다양한 기기나 브라우저 크기에 맞게 구성이나 크기를 변경해가며 반응하는 웹문서 또는 이를 제공해주기 위한 방법이다. 모바일, 데스크톱, 태블릿 등등… 예전에는 도메인을 달리해서 기기에 따른 웹을 제공했다고 합니다. 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 -
React에서 관심사를 분리하는 법 (feat . customHook, router )
Clean Code 좋은 코드를 쓰는것은 중요하다. → 나쁜 코드를 쓰지 않는 것이 중요하다. 하지만 과거의 코드( Legucy )가 나중에 봤을 때 나쁜코드를 의미하는 것은 아니다. 그 당시에 잘 짜인 코드는 지금와서도 마이그레이션 하기 쉬운 코드다. 비판적인 시선으로 바라보지 말자. 좋은 코드를 작성하기 위해서는 좋은 코드의 기준이 무엇인지, 그리고 방법이 무엇인지를 고민하고 연구해야 합니다. 관심사의 분리 개발에는 관심사의 분리 ( Seperation of Concerns ) 용어가 있다. 좋은 코드를 짜기 위한 가장 기본적인 원칙이며, 더 좋은 애플리케이션을 만들기 위한 여러 디자인 패턴, 기법, 아키텍쳐 등은 결국 모두 이 SoC를 가장 기본적인 원칙으로 삼고 있다. 😒 관심사란 ? 하나의 모듈..
2023.05.21 -
소프트웨어 테스트 feat. react
소프트웨어 테스트 테스트란 무언가 동작하는지 확인하는 행위이다. 소프트웨어 테스트란 소프트웨어가 우리가 의도한 대로 동작하는지 테스트하는 행위를 의미한다. 옛날에는 개발자는 개발만하고, 소프트웨어가 올바르게 동작하는지 확인하는 테스트팀이 별도로 존재했고, 개발자는 테스팅 과정에 큰 관여를 하지 않았다. 그러나 최근에는 개발자가 자동화 할 수 있는 소프트웨어 테스트를 구현하고 실행하는것이 보편화 되고 있다. 자동화된 테스트란? 컴퓨터를 통해서 소프트웨어를 테스트하는것을 의미합니다. 소프트웨어를 통해서 테스트를 할 경우… 컴퓨터를 통해서 실행하기에 사람이 실행하는 것보다 빠르다. 정해진 스크립트에 따라 일관성있게 동작하기에 사람이 테스트 할 경우 발생할 수 있는 휴먼에러를 기피할 수 있다. 소프트웨어 테스트..
2023.05.20