반응형 분류 전체보기105 [Javascript] Shadow DOM과 event.composed DOM과 캡슐화DOM(Document Of Model)은 HTML의 구조화된 문서 표현이다. DOM은 브라우저가 페이지에 어떤 것을 만들지 결정한다. HTML 문서의 모든 요소와 스타일로 이루어진 DOM은 하나의 큰 글로벌 범위 내에 있다.이 중 몇몇 요소들은 글로벌에 영향을 받지 않는 즉, 완전한 캡슐화를 필요로 하는 요소들도 있다. 예를 들어 iframe 태그는 전역CSS에 영향을 받지 않고 의도된 스타일로 나타나길 보장받을 수 있다. Shadow DOM이란 과 같은 도구 없이도 캡슐화를 허용하도록 만들어졌다. Shadow DOM이란Shadow DOM은 DOM안의 DOM 이라고 표현할 수 있지만 제대로 표현하자면,원래의 DOM 트리에서 완전히 분리된 고유의 요소와 스타일을 가진 DOM 트리다. S.. 2023. 8. 15. [Javascript] Base64 사용 방법과 사용 이유 (feat. btoa, atob) Base64 인코딩 사용이유Base64란 8비트 이진 데이터(ex. 실행파일, zip파일 등)를 문자 코드에 영향을 받지 않는 ASCII 영역의 문자들로만 이루어진 일련의 문자열로 바꾸는 인코딩 방식이다.즉, 원본 문자열 > ASCII binary > 6bit로 cut > Base64 인코딩 순서로 Base64 인코딩이 진행된다.Base64 인코딩을 사용하는 이유는 암호화나 압축체계가 아니라, 통신과정에서 바이너리 데이터 형태의 손실을 막기 위해서다. 그저 네트워크를 통해 난독화된 문자열을 전송할 수 있는 바이너리 데이터를 ASCII 코드로 변환시킨다. Javascript에서 Base64 사용 방법 btoa()btoa(Binary to ASCII) 바이너리 데이터를 ASCII코드로 변환시킬 때 사용하는.. 2023. 8. 15. [이달의 기록] 2023년 3월 이번달부터 달마다 경험했던 내용을 카테고리별로 써보고자 한다. (이 아이디어를 준 열심히 살고 멋진 동기에게 감사를..ㅎㅎ 꾸준히 쓰길 기원합니다.)[이달의 기록] 퇴사작년 11월에 이직한 4개월만에 회사를 퇴사했다. 그토록 원하던 곳이었고 합격했을때까지만 해도 믿기지 않은 곳이엇다. 하지만 너무 마음의 준비없이 입사했던 탓일까? 다니면서 이곳에서의 삶은 원하는 삶이 아니라는 생각이 들었다.첫 직장을 퇴사한 후 처음으로 이직한 회사였다. 경력직의 무게란 무거웠다. 초반엔 일, 사람들 그리고 출퇴근을 적응하려고 아등바등 지냈던 것 같다. 프로젝트는 말 그대로 전쟁터였다. 마치 나는 병장으로 속이고 들어온 신병같았다. 낯선 상황과 압박 속에서 나의 긴장을 풀어준건 팀원이 아닌 다른 회사분의 따뜻한 말 한마디.. 2023. 3. 26. [Git] 실수로 올린 env 삭제하기 (commit history까지 완전 삭제) git에 env 파일을 실수로 올려버렸다. 최근 사용한 프로그램은 돈이 나가는 프로그램이라 env 파일을 빨리 삭제해야했다. 그래서 검색해보니 명령어는 다음과 같았다. git rm .env --cached git add . git commit -m "remove .env file from git" git push 이렇게 해서 env 삭제는 되었지만... commit한 history에 내 env 파일이 남아있었다. 엉엉 파일만 삭제하려고 보니, delete 버튼이 비활성화가 되어 있어서 삭제하지 못해서 인터넷에 다시 검색해보았다. 찾아보니 git history에서 특정 파일을 삭제할 수 있는 명령어가 있었다!.. git filter-branch --force --index-filter "git rm --c.. 2022. 7. 28. [CSS/Tailwind] Tailwind 연습하기 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 Profile Orders 340 Spent $340 Tony Molloy 미국 Colored by Color Scripter cs 출처: 노마드코더 캐롯마켓 클론코딩 2022. 6. 22. [CSS] 웹사이트 따라만들기, 반응형 헤더편 (유튜브 드림코딩) 애플 사이트 클론 코딩을 하다가... css 기본부터 다시 잡아야겠다는 생각이 들어 드림코딩 엘라님의 프론트엔드 기본 강의들을 정주행이다. 계속 듣다보니까 어렵다고 생각했던 css도 확실히 예전에는 보이지 않았던 것들이 보이고, 예전에는 미처 생각하지 못했던 부분들을 생각하게 되는 것 같다 ^_^ 유튜브 드림코딩 - 웹사이트 따라 만들기, 반응형 헤더만들기 결과물 [HTML - index.html] 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 Document Dream Coding Home Gallery Weddings FAQ Bookings Colored by Col.. 2022. 6. 16. 이전 1 2 3 4 5 6 7 8 ··· 18 다음
