코딩

Q. UI, UX의 개념과 두 개념의 관계에 대해서 설명해 주세요. UI는 사용자 인터페이스를 의미합니다. 즉, 사용자가 애플리케이션 또는 웹사이트와 상호작용하는 방식을 디자인하는 것입니다. UI 디자인은 사용자가 더 쉽게 애플리케이션을 이해하고 사용할 수 있도록 하는 것이 목적입니다. 따라서 UI 디자인은 주로 디자인, 레이아웃, 색상, 폰트 등과 같은 시각적인 측면을 중심으로 합니다. 반면, UX는 사용자 경험을 의미합니다. UX 디자인은 사용자가 제품 또는 서비스를 사용하는 동안 느끼는 감정, 경험, 만족도 등을 고려하여 제품이나 서비스를 디자인하는 것입니다. 즉, UX 디자인은 사용자가 원하는 기능을 쉽고 간편하게 이용할 수 있도록 설계하는 것입니다. 따라서 UX 디자인은 UI 디자인뿐만 아니라 ..

HTTPS는 HTTP Secure의 약자로, 단어 뜻 그대로 기존의 HTTP 프로토콜을 더 안전하게(Secure) 사용할 수 있음을 의미합니다.단지 뒤에 S가 붙었을 뿐인데 왜 HTTP보다 안전하다는 걸까요? 그 이유는 HTTPS가 HTTP와 달리 요청과 응답으로 오가는 내용을 암호화하기 때문입니다. HTTP로 보낸 요청을 'wireshark'라는 패킷 분석 프로그램을 이용하여 캡처한 것입니다. 이미지를 확인해 보면, email과 password 같은 값을 그대로 볼 수 있는 것을 알 수 있습니다. 이는 제3자가 HTTP 요청 및 응답을 탈취한다면 전달되는 데이터의 내용을 그대로 확인할 수 있다는 뜻이기도 합니다. 이처럼 HTTPS가 HTTP 통신을 암호화하기 위해서 어떤 과정을 거치는지 조금 더 자세히..

네트워크 계층모델 OSI 7계층 모델 1계층: 물리계층 - 주로 전기신호를 전달하는데 초점, 들어온 전기신호를 그대로 잘 전달하는 것이 목적 2계층: 데이터링크 계층 - 네트워크 기기간 데이터 전송 및 물리주소를 결정하는 계층 3계층: 네트워크 계층 - 라우팅 담당, 빠르게 보낼 최적의 경로 선택 (IP 패킷 전송) 4계층: 전송 계층 - 해당 데이터들이 정상적으로 보내지는 지 확인하는 역할 (TCP/UDP 연결) 5계층: 세션 계층 - 세션의 연결의 설정과 해제를 수행 6계층: 표현계층 - 응용계층으로 전달하거나 전달받는 데이터를 인코딩 또는 디코딩하는 계층, 일종의 번역기 역할 수행 7계층: 응용계층 - 최종적으로 사용자와의 인터페이스를 제공하는 계층, 사용자가 실행하는 응용프로그램들이 해당(chro..

하지만 TCP와 UDP는 IP의 종류가 아니라, IP와 함께 사용되는 전송 계층 프로토콜입니다. IP는 인터넷상에서 패킷 전달을 담당하는 프로토콜이고, TCP와 UDP는 이러한 IP 패킷을 보내고 받는 데이터의 전송을 담당합니다. Q: IP와 TCP와 UDP의 차이점을 모르겠어 A: IP(Internet Protocol)은 인터넷 상에서 컴퓨터들이 서로 데이터를 주고받을 수 있도록 하는 프로토콜로, 인터넷 상에서 데이터를 전송하는 데 사용됩니다. IP는 패킷 단위로 데이터를 전송하며, 각 패킷은 출발지 IP 주소와 목적지 IP 주소를 가지고 있습니다. TCP(Transmission Control Protocol)와 UDP(User Datagram Protocol)는 IP와 함께 사용되는 전송 계층 프로토..

아침에 일어나면, 비추는 햇빛이 나를 짓누를 때가 있다. 또 아침이구나,,, 반복되는 준비하는 하루 어제도 늦게 잤다. 바짓가랑이를 붙잡으며 ‘최소 이정도는 하고 자야지’ , 밤에 끝에 몰아서 해치운게 며칠이 되었다 열심히 공부를 하다가, 갑자기 축 쳐지는 순간이 있다 그럴땐 내가 수중도시에 있는 것 같다 밖은 햇살처럼 반짝거리는데 내가 머무는 곳은 어둡고 축축한 곳 한 줄기 빛을 제외하고는 뚜렷하게 보이는 것이 없다. 잘 풀리는 날엔 신나서 공부를 하게 되고, 어느날엔 눈을 뜨기도 싫다. 공부가 싫은 거냐고? 그건 아니다. 내가 선택한 길이고 간절히 바라는 바다. 그런데, 긴 터널안에 들어와 있으니 그 끝이 참 막연하더라… 시작길에 오른지 얼마안되었는데, 부담감에 지칠때가 있다. ‘내가 잘할 수 있을까..

응 맞다! styled-component는 웹표준을 향상시킨다. 왜 그럴까? styled-components가 웹표준을 해치지 않는 이유는, 결국 styled-components가 생성하는 스타일 코드는 일반적인 CSS와 동일하기 때문이다. 생성된 CSS는 HTML 문서 내의 태그에 포함되며, 웹 브라우저가 이를 해석하여 렌더링한다. 아주 똘똘한 녀석이다 난 아직 styled-component 사용이 어색하니 오늘 과제한 내용을 포스팅 해보겠다. styled-component가 뭔데? styled-component는 리액트에서 css스타일을 작성하고 관리하기 위한 라이브러리 이다 기존의 css를 사용하는 방법과 달리, 'styled-components' 는 javascript 코드내에서 css 스타일을 ..

웹표준이란? 2000년대 초에는 인터넷 익스플로러에서는 작동이 되어도 사파리나 파이어폭스 같은 다른 브라우저에서는 작동이 되지 않는 등 브라우저간 호환이 되지 않아서 댓글을 못 다는 정도가 아니라 화면이 아예 정상적으로 나오지 않는 일도 있었습니다. 이를 막고, 웹을 정상적으로 구동시키기 위해서는 개발자들이 각 브라우저마다 따로 개발을 해주어야만 했습니다. 이런 수고를 없애고 웹 개발의 형식을 통일시킨 것이 바로 웹 표준이라고 합니다 웹 표준이란 W3C(World Wide Web Consortium)에서 권고하는 ‘웹에서 표준적으로 사용되는 기술이나 규칙’으로, 사용자가 어떠한 운영체제나 브라우저를 사용하더라도 웹페이지가 동일하게 보이고 정상적으로 작동할 수 있도록 하는 웹 페이지 제작 기법을 담고 있습..

최근에 redux를 배웠는데, Reducer 부분에 잠깐 등장했던 switch 문법에 대해서 다뤄보려고 합니다. 정말 간단한 포스팅입니다. 쉬어가기... Reducer는 Dispatch에게서 전달받은 Action 객체의 type 값에 따라서 상태를 변경시키는 함수입니다. 다음은 Reducer에서 switch 구문을 활용한 예시입니다. 아래 보이는 것처럼 Reducer는 Action 객체의 type 값에 따라 분기하는 switch 조건문을 사용하고 있습니다. const count = 1 // Reducer를 생성할 때에는 초기 상태를 인자로 요구합니다. const counterReducer = (state = count, action) => { // Action 객체의 type 값에 따라 분기하는 swit..