Today Hailie Learned

UX는 UI를 포함한다. 또한 좋은 UX가 좋은 UI를 의미하거나, 좋은 UI가 항상 좋은 UX를 보장하지는 않는다. UI UI(User Interface, 사용자 인터페이스)는 사람들이 컴퓨터와 상호 작용하는 시스템을 의미한다. * 화면상의 그래픽 뿐만 아니라, 키보드, 마우스도 UI이다! GUI(Graphical User Interface, 그래픽 사용자 인터페이스) 요즘에는 스마트폰과 컴퓨터뿐만 아니라 스마트워치, 키오스크, 대중교통 터치스크린 안내판 등 화면과의 상호 작용을 통해 사용하는 기기들을 어렵지 않게 찾아볼 수 있다. 이처럼 현대 사회에서는 그래픽 UI, 즉, GUI(Graphical User Interface)가 굉장히 중요한 역할을 한다. GUI는 사용자가 그래픽을 통해 컴퓨터와 정보..

useState const [changeData, setChangeData] = useState('') useState는 리액트 라이브러리에서 제공하는 함수인데 컴포넌트 함수가 다시 호출되는 곳에서 변경된 값을 반영하기 위해 state로 값을 정의할 수 있게 해주는 함수이다. state가 변할 때, 이 컴포넌트 함수를 다시 호출하고 싶으면 state를 업데이트하는 함수(set어쩌고)를 호출하면 된다. 왜냐하면 그 함수를 호출해서 state에 새로운 값을 할당하고 싶다고 리액트에게 말하고 그런 다음 함수는 또한 useState로 state가 등록된 컴포넌트는 재평가되어야한다고 리액트에게 말한다. 그래서 리액트는 이 컴포넌트 함수를 다시 실행하고 또한 이 JSX코드를 다시 평가한다. 그리고 지난 번과 비교해..

백준 15740, A+B - 9 문제를 풀었는데 40점이 나왔다. 처음에는 왜 40점만 맞았는지 이해가 되지 않았는데 이번에 새롭게 알게 된 내용이 있어서 정리한다. 문제 두 정수 A와 B를 입력받은 다음, A+B를 출력하는 프로그램을 작성하시오. 입력 첫째 줄에 A와 B (-1010000 ≤ A, B ≤ 1010000)가 주어진다. 출력 첫째 줄에 A+B를 출력한다. 서브태스크 번호배점제한 1 5 0 ≤ A, B ≤ 10 2 10 -100 ≤ A, B ≤ 100 3 10 0 ≤ A, B ≤ 109 4 15 -109 ≤ A, B ≤ 109 5 15 0 ≤ A, B ≤ 260 6 20 -260 ≤ A, B ≤ 260 7 20 0 ≤ A, B ≤ 1010000 8 5 -1010000 ≤ A, B ≤ 1010..

JSON이란? JSON은 JavaScript Object Notation의 줄임말로, 서로 다른 프로그램 사이에서 데이터 교환을 위해 만들어진 객체 형태의 포맷이다. 이 형식은 사람이 읽고 쓰기에 용이하며, 기계가 분석하고 생성함에도 용이하다. 네트워크를 통해, 어떤 객체 내용을 다른 프로그램에게 전송한다고 가정할 때, 메시지를 보내는 발신자와 메시지를 받는 수신자가 같은 프로그램을 사용하거나, 문자열처럼 범용적으로 읽을 수 있는 형태여야 한다. 객체는 타입 변환을 이용해 String으로 변환할 경우 객체 내용을 포함하지 않는다. JavaScript에서 객체를 문자열로 변환하기위해 메서드(message.toString())나 형변환(String(message))을 시도하면, [object Object] ..

보호되어 있는 글입니다.

Cannot set headers after they are sent to the client 에러 원인 Express js. 파일이 하나의 요청(request)에 대해 하나 이상의 응답(response)를 보낼때 생기는 오류 입니다. 에러 해결하기 핵심은 실수로 두 번 호출되는 콜백이나 몸이 전송된 후에 발생하는 오류를 찾아보는 것입니다. 제 코드에서는 오류를 잡는 코드가 2번 반복되어 있어서 오류가 나타나는 것으로 확인하고, 하나를 삭제했습니다. 그랬더니 오류해결! 참고 https://bobbyhadz.com/blog/javascript-error-cannot-set-headers-after-they-are-sent-to-client https://avengersrhydon1121.tistory.co..

매번 파일을 실행하지 않고, npm start 명령어를 이용하는 방법! 노드몬을 이용하자!! 👇설치방법👇 npm install nodemon으로 설치 package.json의 "scripts"에 아래 코드를 추가하기 "start": "nodemon server/basic-server.js" or npx nodemon으로 server/basic-server.js 파일을 실행하기 npx nodemon server/basic-server.js 참고 https://github.com/remy/nodemon 😃 잘못된 개념 전달이 있다면 댓글 부탁드립니다. 저의 성장에 큰 도움이 됩니다🤓

SyntaxError: Unexpected token " in JSON at position 0 at JSON.parse 에러의 원인 => json 형태가 아닌 데이터를 json으로 파싱하려고하니까 뜨는 에러 에러 해결방법 express.json()을 하면 배열 또는 객체의 형태만 받아들인다. 그런데 배열이나 객체가 아닌 다른 형태의 body를 가지고 오고 싶다면 (req.body) strict를 false 처리해야한다. 👇Express 공식문서 참고 👇express.json()에서 strict를 false 처리하는 방법 const jsonParser = express.json({strict : false}); 번외 SyntaxError: Unexpected token A in JSON at positi..

미션! 클라이언트의 액션(버튼 클릭)에 따라 각기 다른 HTTP 요청을 서버로 보내고, HTTP 요청에 담아 보낸 단어를 소문자 또는 대문자로 응답을 받아 화면에 보여 주기! 스터디 시간에 정답 코드를 봤기 때문에 자신 있게 도전했지만 풀리지 않았다.. 정말 코드에는 문제가 없었다. 그래서 여기저기 코드를 다시 보고, 끝내는 깃 클론을 다시 해와서 새로운 파일에서 코드를 작성했는데도 실행이 안됐다. 10시가 넘어서 같이 풀었던 페어에게 연락이 왔다. 그때까지만 해도 스터디에서 정답인 코드를 봤기 때문에 금방 해결할 수 있을 것 같다고 했는데 안됐다. 두시간이 넘도록 들여다봤는데도 도저히 해결책을 못찾겠어서 너무 답답했지만, 이대로 잘 수는 없었다!!! 그래서 정말 지푸라기라도 붙잡는 심정으로 디스코드에 ..

저의 default 브라우저 설정은 safari였습니다. 그런데 콘솔창을 볼 때나, 다른 작업을 할 때 chrome 브라우저가 훨씬 좋았습니다. 그래서 지금까지 복사 & 붙여넣기 또는 클릭을 하는 등 굉장히 비효율적인 방법으로 chrome 브라우저로 창을 띄웠는데 더이상 참을 수 없어서 visual studio code의 기본 브라우저 설정을 바꿔보았습니다. 1. vs code에서 톱니바퀴를 누르고, 설정에 들어갑니다. 2. browser 라고 검색한 뒤, Open-in-brower: Default 값을 chrome으로 적어둡니다. 3. 끝!! 정말 쉽고 간단해서 이제부터 더 빠르고 효율적으로 코딩 공부할 수 있게 되었어요!