코드로 대화하기

알고리즘을 풀며 문득 생각이 들었다. 가독성이 좋지만 긴 코드가 좋은 것일까 가독성은 떨어지지만 짧은 코드가 좋은 것일까 코딩을 한다는 것은 코드와 대화를 하는 것과 동시에 코드를 통해 다른 사람들과 소통을 한다고 생각한다. 나는 가동성이 좋은 코드를 선택하겠다.

오늘은 자신만의 라이브러리 npm(node package manager)을 만들어보겠습니다. 우선 npm사이트 회원가입이 후 이메일 인증을 해주세요. https://www.npmjs.com/ npm Bring the best of open source to you, your team, and your company Relied upon by more than 11 million developers worldwide, npm is committed to making JavaScript development elegant, productive, and safe. The free npm Registry has become the center of Java www.npmjs.com 1. react파일을 생성하고..

포트번호 cmd 창에서 아래 코드를 입력하면 현재 활성화되어있는 포트 번호가 나옵니다. netstat -ano 포트 번호를 삭제하려면 pid 이용하면 됩니다. taskkill /f /pid 0000 아이피 아이피를 확인하려면 cmd 창에 아래 코드를 입력하면 됩니다. ipconfig "IPv4 주소"라는 것이 있는데 localhost 대신 사용 가능합니다.

모바일로 웹에 접속하여 input을 터치하였을 때 줌 인되는 것을 방지해 주는 코드입니다. html에 meta 태그를 추가해 줍니다. react 같은 경우 index.html에 추가합니다. 정리하자면 이렇습니다. initial-scale=1.0 // 초기 크기를 설정합니다. user-scalable=no // 확대 기능을 사용하지 않습니다. maximum-scale=1 // 최대 배율, 크기를 설정합니다. width=device-width // 화면이 표현하는 사이즈를 디바이스 사이즈에 맞춥니다.

오늘은 양방향과 단방향 데이터 바인딩을 알아보겠습니다. 데이터 바인딩 (Data binding) 먼저 데이터 바인딩이란 뷰와 모델에 있는 데이터를 동일하게 만들어주는 것을 의미합니다. 만약 js에서 데이터가 변경되어도 html에서 변경되지 않는다면 사용자는 잘못된 데이터를 보게 됩니다. 데이터 바인딩은 이러한 문제를 해결해줍니다. vanila javascript로 예를 들어보겠습니다. Hello const data = "song"; function changeText(){ const view = document.querySelector("#view"); view.innerText = data; } js에 있는 데이터를 화면상에 보여주기 위해서는 아래의 과정들이 있습니다. 1. document 선택자로 D..

안녕하세요! 크롬에서 개발하고 다른 브라우저에서 테스트를 할 때면 다양한 이유로 터질 때가 있습니다. Polyfill 호환되지 않는 문법들을 사용가능하게 만들어줍니다. npm i react-app-polyfill로 설치해주세요. index.js상단에 polyfill을 불러옵니다. // IE9 import 'react-app-polyfill/ie9'; import 'react-app-polyfill/stable'; // IE11 import 'react-app-polyfill/ie11'; import 'react-app-polyfill/stable'; js & css javascript 내장함수나 css 중 일부는 크로스 브라우징이 안될 때가 있습니다. 그럴 때 저는 접속하고 있는 브라우저를 판단하여 분기..

React Native(RN) 기초에 대해 알아보겠습니다. Styling CSS를 설정할 때 object의 namespace를 이용힙니다. 각 스타일의 속성의 구분은 ; 가 아닌 , 로 구분합니다. 스타일 속성 명의 구분은 -이 아닌 대문자로 구분합니다. (font-weight -> fontWeight) 'px', 'em' 등의 단위는 사용하지 않습니다. -> '%', 'rem' 을 사용합니다 bigBlue: { color: 'blue', fontWeight: 'bold', fontSize: 30, } 축약형이 존재하지 않습니다. 대신 상하, 좌우 값을 한 번에 조정할 수 있습니다. item: { marginVertical: "0rem", marginBottom: "4rem", marginLeft: "6..

프론트엔드 개발을 하다 보면 윈도우에서 잘 나오는 날짜가 ios로 넘어갈 경우 NaN으로 나오는 에러가 있습니다. 날짜를 렌더링 하는 방식이 달라 나오는 에러로 replace()를 사용하면 해결됩니다. new Date(----.replace(/-/g, "/"))

안녕하세요! 오늘은 웹의 기초인 쿠키와 세션에 대해 얘기해보려합니다! Cookie 서버에서 사용자의 컴퓨터에 저장하는 기록 정보 파일입니다. 이는 사용자가 다음번에 접속시에도 재사용가능하게 만들어줍니다. 특징 이름, 값, 만료일, 경로정보로 구성되어있습니다. 클라이언트에 총 300개의 쿠키를 저장할 수 있습니다. 하나의 도메인당 20개의 쿠키를 가질 수 있습니다. 하나의 쿠키는 4kb까지 저장가능합니다. 사용자마다 적절한 페이지를 보여주고 트레킹이 가능합니다. Session 사용자가 한 브라우저내에서 계속 통신을하고 새로고침하여도 상태를 일정하게 유지시켜줍니다. 특징 상태를 유지하기 위하여 서버에도 저장됩니다. 브라우저를 종료하면 삭제되어 비교적 안전합니다. 저장데이터 제한이 없습니다. 사용자마다 고유의..