Land of Joe

드디어 마르고 닳도록 들어본 (듣기만 한) 개념들에 대해 배웠다. 아직 리액트 어플(CRA..뭔지 잘 모름)에 한 건 아니고, 그냥 html에 바벨 라이브러리 설치해서 script 안에 개발하고 있다. CRA를 사용하지 않은 바벨의 특성 상(?) html 파일 하나에 전부 때려박아야 해서 파일을 컴포넌트 단위로 나누어보지도 않아 아직 내가 리액트를 하고 있다는 게 별로 실감이 나지 않았는데 그동안 유튜브 등에서 귀동냥으로 들어왔던 리액트 대표 개념들을 배우니 뭔가 설레었따. 히히 여튼 시좍좍 1. Virtual DOM 버츄얼 돔 1-1. Virtual DOM의 존재 이유 요즘같이 한 페이지에 많은 데이터를 출력하는 웹에 있어 브라우저의 동작 구조는 매우 비효율적이다. [ 브라우저 동작 구조 ] (1) D..

지난 주엔 바닐라 자바스크립트를 가지고 리액트의 구조를 따라해보는 시간을 가졌다면, 이번 주엔 드디어 리액트 문법을 배우는 시간을 가졌다. 리액트 앱(CRA) 내부에서 그 문법을 사용한 것은 아니고, 그냥 JS에서 리액트 문법을 배워보았다. CRA에서 배우지 않고 바닐라 JS에서 진행한 이유는 - CRA를 동작시키는 것들이 문법 외에도 너무 많다 (ex. Node.js 등) - 그러한 것들을 모르는 채로 CRA를 바로 시작해버리면 문법에 대한 이해도가 떨어지게 된다. 여튼 저번주부터 심화수업이 시작되고 나서는 리액트를 제대로 배워나가기 위해 계속 약한 불로 슬슬 가열하는 느낌, 자동차를 운전하기 전에 시동을 부릉부릉 걸어놓는 느낌이 든다. 가보좌 1. 리액트는 왜 배워야하는가? (부제: 기존 바닐라 웹 ..

그동안은 변수를 만들 때 var만 사용해왔다. 그러나 var의 문제점은 "중복선언이 가능"하고 "호이스팅이 된다"는 점이다. 먼저 중복 선언의 예시 var를 통해 만든 num1은 위에서부터 아래로 읽는 js의 성격에 따라 서로 다른 값을 넣어준 것의 결과가 그대로 출력된다. 그러나 함수의 경우는 또 그렇지 않다는 게 이상한 점. 호이스팅(Hoisting)이란: 변수와 함수의 선언부분을 파일의 상단으로 끌고 올라오는 JS만의 편의기능이다. 위 중복 선언의 예시가 작동하는 순서대로 쓴 것이 아래의 이미지이다. var num1 =10;에서 선언부는 var num1에 해당하고, function printMessage() {console.log("hello")}는 전체가 선언부에 해당한다. JS가 작동하는 순서에..

Git 분산 버전 관리 소프트웨어 기본적으로 로컬 시스템(내 컴퓨터에 저장된다는 소리) → 그래서 컴터 잘못되면 난리남 Git hub Git의 기능을 하는 온라인 클라우드 개발자의 포트폴리오 [ 용어정리 ] Repository (개념) 저장소 (프로젝트 폴더) 현재 진행 중인 프로젝트에 깃을 설치하면 repository가 됨 add (명령어) stage에 코드를 추가하는 명령어 stage (개념) 임시저장공간 (버전으로 만들기 전의) Git은코드를 저장하는 소프트웨어가 아니라, 버전을 저장(차이점만 저장)하는 소프트웨어 용량적으로 이득 (누적되는 게 아니니깐) 앞 버전과의 차이점을 빠르게 확인 가능 commit (명령어) stage에 있는 내용을 버전으로 만드는 명령어 ..

클라이언트와의 첫 (가상)미팅을 진행하고 그에 따른 스토리보드 제작과 기능명세서 작성을 하였다. 스토리보드는 보통 ppt나 figma를 사용한다고 한다. 나는 실력이 거의 없을 때 팀 프로젝트를 한 경험이 두 번 있는데 (둘다 엎어짐) 두 번 다 디자이너가 따로 있었고, 모두 피그마를 사용하는 걸 어깨 너머로 지켜봐왔었다. 그리고 현업에서 그 중요성에 대해 언급하는 영상도 유튜브에서 많이 봐왔기 때문에 이번에 기회에 나도 피그마를 이용해 스토리보드를 만들어보고 싶다고 생각해 도전해보았다. 만들수록 내가 어디까지 만들어야하나 생각이 들었다. 사용자의 행동에 따라 생기는 변화 하나하나를 전부다 만들어내야 한다는 압박감(?)이 들어서 의 방법으로 만드는 드롭다운 리스트나, 으로 만드는 시간 선택 박스, 심지어..