본문 바로가기

제니의 개발일지/개발일지27

TIL - html 명함 만들기 테이블 태그 html로 리액트만 썼다고 html 코드 쓰려고 하니까 살짝 흠칫했다. 역시 코드는 계속 써보고 써봐야 두려움 없이 나아갈 수 있는 것 같다 ㅠㅡㅠ 회사 메일에 명함을 서명 설정해야 하는 일이 있는데, 이번에 또 새로운 걸 배우게 되었다. 처음엔 디자이너님이 , , 태그 등을 사용해서 명함 서명 코드를 만들어주셨는데, 이메일이 구 기능을 가지고 있는 회사들의 경우 명함 css 가 깨질 수 있어, 테이블 태그를 사용하는 것이 좋다고 해 변경을 하게 되었다. 요즘 테이블 태그를 많이 안 쓴다는 블로그 글도 많던데, 모두가 신 기능을 사용하는 것은 아니니까 익혀두면 좋을 것 같았다! 참고로 카카오, 네이버 등도 서명 설명 html 바꿔보면 테이블 태그로 나온다 ㅎㅎ ✅ 오늘은 무엇을 느꼈는지? 1. 미리 코드.. 2022. 12. 2.
TIL - 2022.10.24 - 웹 프로토콜, AJAX, React를 왜 사용할까, 이벤트 버블링, 이벤트 버블링을 막는 방법, 이벤트 버블링 활용 방법, 이벤트 위임, 부모에서 자식으로 이벤트 상속하는 방법 ✅ 정리했었던 내용 복습 1️⃣ 웹 프로토콜이란? - 프로토콜이란, 데이터를 송수신하기 위한 규칙 - 서버와 클라이언트 모두 HTTP를 이용해 통신하기 때문에 HTTP에 대한 지식이 중요하다. - HTTP는 GET, POST, PUT ,HEAD 4가지 요청 형식이 있다. - GET은 문서를 요청하고 서버가 클라이언트에 상태 정보와 복제된 문서를 보냄으로써 응답한다. - POST는 데이터를 서버로 송신하고 서버는 해당 데이터를 특정 아이템에 덧붙인다. - PUT은 데이터를 서버로 송신하고 서버는 특정 아이템을 완전히 대체한다. - HEAD는 상태 정보를 요청한다. GET과 동일한 형태로 응답을 하지만 문서를 복제하지는 않는다. 2️⃣ AJAX란 무엇인가? - Asynchronous JavaScript An.. 2022. 10. 24.
TIL - 2022.10.22 - TCP, UDP, URL 입력시 일어나는 일, Event loop, RESTful API, GET POST 차 ✅ 정리했었던 내용 복습 1️⃣ TCP, UDP 차이점 - 연결방식 : TCP는 연결형 서비스, UDP는 비연결형 서비스 - 패킷교환방식 : TCP는 가상회선 방식, UDP는 데이터그램 방식 - 전송 순서 : TCP는 전송 순서를 보장하지만, UDP는 바뀔수가 있다. - 속도 : TCP는 느리고 UDP는 빠르다. - 신뢰성 : TCP는 신뢰성이 높고 UDP는 신뢰성이 낮다. - 수신 여부 확인 : TCP는 수신 여부를 확인하고 UDP는 확인하지 않는다. - 통신 방식 : TCP는 1:1 통신 방식이지만, UDP는 1:1, 1:N, N:N 방식으로 통신한다. 🔷 UDP : IP를 사용하는 네트워크 내에서 컴퓨터들 간에 메시지를 교환할 때 제한된 서비스만을 제공하는 통신 프로토콜 2️⃣ 브라우저 주소창에 u.. 2022. 10. 22.
TIL - 2022.10.18 Virtual DOM, useRef, useEffect, var, let, const, Async/Await, Promise ✅ 정리했었던 내용 복습 1️⃣ Virtual DOM과 Real DOM의 차이 - DOM(Document Object Model)은 웹 페이지를 이루는 태그들을 자바스크립트가 이용할 수 있게끔 브라우저가 트리 구조로 만든 객체 모델 - DOM은 HTML에 동적인 변화가 있을 경우 전체 페이지(DOM Tree)를 검색해서 해당 부분을 교체한 후 전체 페이지에 대해 리렌더링을 해주어야 하는 문제점이 발생, 이에 대한 문제점을 해결하기 위해 나온 것이 Virtual DOM - Virtual DOM을 사용하면 실제 DOM에 조작하여 접근하는 대신, 추상화한 자바스크립트 객체를 구상하여 사용한다. - DOM의 상태를 메모리에 저장하고 데이터가 업데이트 되면 전체 UI를 Virtual DOM에 리렌더링 해서 이전 .. 2022. 10. 18.
TIL - 2022.10.17 상태 관리, Redux란? React, CS 공부 꾸준히 하자!! 리액트를 다루는 기술 책을 읽고 있는데 겹치는 부분도 많다. 여러 번 보면서 장단점을 파악하고 이해해야 할 것 같다. 사용하고 있지만 명확하게 이유를 모르고 코딩만 할 때가 있다. 그렇게 하지 않도록 꾸준히 공부를 해보기! ✅ 정리했었던 것 + 다시 정리하기! 1️⃣ 상태관리를 왜 할까? - 서로 다른 컴포넌트에 같은 데이터가 필요하다고 할 때, 각 컴포넌트가 부모 자식 관계로 되어 있지 않은 이상 직접적인 데이터 전달이 어렵다. - 데이터를 부모 컴포넌트로 보내고 다시 필요한 컴포넌트로 전달을 해야 하는데, 이렇게 Prop Drilling이 많아지면 이 Prop이 어디에서 왔는지 확인하기가 어려워 상태관리를 해야 한다. - 평소 State관리는 Redux로 하고 .. 2022. 10. 17.
항해99 7주차 WIL - 인스타그램 클론코딩, 실전 프로젝트 시작 드디어 인스타그램 클론코딩까지 마치고, 실전 프로젝트가 시작되었다! 클론코딩을 하면서 한번 더 느낀 점이 있었다. 나는 꽤 CSS를 즐긴다는 것...? 와이어 프레임 만드는 것도 즐겁고 CSS를 구성하면서 뷰의 완성본을 만드는 것도 즐겁다. 아직 코드 구현은 매번 힘들고 고민이 많고 수십번의 구글링을 거치고 있지만, 신기하게도 CSS는 그 구글링 과정조차 나를 즐겁게 하고 있다. 미니프로젝트처럼 내가 만드는 프레임에 맞춰 CSS를 하는 것은 쉽지 않다. 아무래도 나는 디자이너가 아니다보니 첫 구성은 힘든 것 같았다. 하지만 클론코딩처럼 이미 구현되어 있는 CSS를 참고해본다거나 팀끼리 프레임이 잘 만들어져서 CSS를 만들게 되면 그렇게 즐거울 수가 없었다. 그래서 살짝 실전프로젝트에서 디자이너인 미래님을.. 2022. 8. 28.

티스토리툴바