본문 바로가기

개발일지25

2024.01.16 공부 일기 - 코딩 & 코딩 & 코딩 안녕하세요. 제니입니다! 저번주 화요일에 앞으로 프로그래머스 캘린더에서 제공해주는 코딩테스트 5개를 꼭 풀어보겠다고 다짐했는데, 회사 업무도 사알짝 바빳고 운동을 다니느라 정신이 없어서 오늘은 이틀치를 풀어봤어요! 매주 화요일은 퇴근하구 집에 가지 않고 카공을 하고 있다보니 그래도 꾸준히 공부시간은 지켜져서 다행입니다 ㅎㅎ 원래 개발일지를 따로 쓰지 않구 공부한 내용을 정리하는데 오늘은 다행이 정리할 내용이 없더라구요! 확실히 공부하면 할수록 적응되는 것 같아요(코테 공부는 시작한지 얼마 안 됐지만...) 매주 알고리즘 강의 1강도 프로그래머스거로 듣고 있는데 생각보다 도움은 되지 않지만, 익숙해지기 위한 과정으로 생각하고 있습니다! 오늘 회사에서 그래프를 모듈화해서 개발하는 과정에 drag기능을 추가하.. 2024. 1. 16.
[TypeScript] useRef 모달 바깥 영역 클릭 이벤트 오랜만의 블로그 포스팅 매일 회사에서 코딩을 하면서 정신없는 시간을 보내다 보니 정리를 못했는데, 시간 날 때마다 유용하게 써먹었던 코드를 정리하기는 해야겠다. 반복적으로 쓰이는 코드들은 다시 내 코드를 찾아보는 경우가 많은데 몇 달사이에 그나마 코드 리팩토링을 하게 되는 나를 보면서 아주 조금의 배움과 반성을 함께 하는 중!! 옆에 사수님이 계셔서 정말 감사하고 도움이 많이 된다. 그 동안, 모달 바깥 영역을 구현했던 방식은 useState로 open이면 true가 되고 이런식의 코드였는데 그렇게 되면 발생되는 문제는 ❗ 영역 바깥을 클릭했을 땐 꺼지지 않을 수 있다는 것! 물론, position fixed를 해서 모달을 띄운다거나 할 경우엔, 여러 가지 방법을 통해서 모달을 끌 수는 있지만 번거롭다... 2023. 3. 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.23 - 서버 사이드 렌더링, MVC 패턴, 아토믹 디자인 패턴, HTTP/HTTPS 차이점 ✅ 정리했었던 내용 복습 1️⃣ 서버 사이드 렌더링 - 서버에서 페이지를 그려 클라이언트(브라우저)로 보낸 후 화면에 표시하는 기법 - 검색 엔진 최적화와 빠른 페이지 렌더링에 효과적 - OG태그를 페이지별로 적용하기 위해서는 서버 사이드 렌더링이 효율적 - 서버에서 미리 그려서 브라우저로 보내기 때문에 페이지를 그리는 시간을 단축할 수 있다. - 클라이언트 사이드 렌더링 : 빈 HTML을 받아 브라우저에서 그리는 것 2️⃣ MVC 패턴 - MVC란, Model-View-Controller 의 약자로 애플리케이션을 세 가지 역할로 구분한 개발 방법론 - 사용자가 Controller를 조작하면, Model을 통해 데이터를 가져오고 그 데이터를 바탕으로 View를 통해 시각적 표현을 제어하여 사용자에게 전달.. 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.

티스토리툴바