Others 31

webkit css 확장

스타일 시트 CSS 접두어 webkit, moz, ms, o 의미 MDN | WebKit CSS extensions 웹에서 CSS 를 적용할 때 webkit, moz, ms, o 접두어가 속성앞에 붙은 것을 종종 보실 수 있을 겁니다. 크로싱 브라우저를 위해서 필요하기 때문 -webkit- : 구글, 사파리 브라우저에 적용 -moz- : 파이어폭스 브라우저에 적용 -ms- : 익스플로러에 적용, 보통 생략합니다. -o- : 오페라 브라우저에 적용 크로싱 브라우저란? 웹 페이지 제작 시에 모든 브라우저에서 깨지지 않고 의도한 대로 올바르게(호환성) 나오게 하는 작업

Others 2022.12.23

webkit 웹킷이란

위키백과 | 웹킷 웹킷(영어: WebKit)은 웹 브라우저를 만드는 데 기반을 제공하는 오픈 소스 응용 프로그램 프레임워크이다. 원래는 Mac OS 10의 사파리 웹 브라우저 엔진으로 사용하기 위해 컨커러 브라우저의 KHTML 소프트웨어 라이브러리에서 가져온 것이었으나 지금은 옴니웹, 시이라, 아로라, 미도리, 유즈블, iCab, 어도비 통합 런타임, 휴대 전화(아이폰 포함), 노키아의 Series 60 브라우저, 구글의 안드로이드 플랫폼에 사용되고 있다. 웹킷은 하나의 완제품이 아니기 때문에 웹킷엔진을 탑재하고 최종 사용자가 이를 이용할 수 있도록 해주는 웹애플리케이션이 필요하다. 대표적인 애플리케이션이 웹 브라우저이다. 현재 웹킷엔진을 탑재한 웹브라우저는 구글 크롬, 애플 사파리, 안드로이드 웹브라우..

Others 2022.12.23

git stash: 임시저장하기

LainyZine: 프로그래머 가이드 🐣| git stash 사용법: 커밋하지 않고 변경사항 저장하는 방법 git stash git stash pop 변경사항을 임시로 저장하는 git stash 명령어와 이렇게 저장한 임시 변경 사항을 꺼내오는 git stash pop 명령어 수정하고 있는데 도중 다른 사람이 새로운 커밋을 하였을 때 git stash git pull git stash pop //에러핸들링 git add . git commit -m "" git add . .gitignore파일에 있는 파일명들은 제외하고 stage에 올리는 것

Others 2022.12.23

아토믹 디자인

컴포넌트를 설계하는 기준이 제각각일 때 atomic design이 유용 atomic design 모든 것은 atom(원자)으로 구성되어있고 atom(원자)들이 서로 결합하여 molecule(분자)이 되고, molecule는 더 복잡한 organism(유기체)으로 결합하여 궁극적으로 모든 물질을 생성함 이 개념을 차용해서 컴포넌트를 atom, molecule, organism, template, page의 5가지 레벨로 나뉨 atom: 더 이상 분해할 수 없는 기본 컴포넌트입니다. label, input, button과 같이 기본 HTML element 태그 혹은 글꼴, 애니메이션, 컬러 팔레트, 레이아웃과 같이 추상적인 요소도 포함 molecule: atom을 결합하여 자신의 고유한 특성을 가짐. but..

Others 2022.12.06

프로그래밍 언어의 계층: 고수준 언어, 저수준 언어(feat. 컴파일)

컴퓨터는 이진법으로 이루어 져있음 (0,1로만 이루어져있는 '기계어') 기계 언어 - 프로그래밍 언어 - 사람 언어 컴퓨터와 사람의 언어 중에 어느 쪽에 가까운가? 고수준 언어: 사람의 언어에 가까움 컴파일 언어: 프로그래밍을 마친 뒤 코드 전체를 미리 기계어로 번역(컴파일)한 다음 실행 파일을 생성해서 실행 컴파일 과정 때문에 전체 개발 시간은 늘어나지만, 오류로부터 안전하고 실행 속도가 빠름 인터프리터 언어: 작성된 코드 한 줄 한 줄 통역하면서 실행되는 언어 신속하고 유연한 개발과정이 필요한 소프트웨어에 사용 컴파일 언어 인터프리터 언어 C, C++, C#, Java, Typescript, Kotlin, Swift, Scala, Go, Rust Javascript, Python, Ruby, PHP,..

Others 2022.12.02

신입개발자 스타트업 기술면접 질문 | 프론트엔드, Javascript, React

부트캠프가 끝나고 적극적으로 취업 준비를 하면서, 첫 단계인 서류 통과를 해야겠지만 서류 통과를 하더라도 면접이 기다리고 있다. 2022년 10월~11월 동안 다섯 곳 정도 면접을 보았는데 나와 같은 취업 준비생들이 도움이 되길 바라며 그 때 받은 기술 질문들은 모아봤다. 면접을 본 기업은 Javascript, React를 기술스택으로 쓰는 50인 이하 스타트업들이었다. 프론트엔드 채용을 위한 기술면접 질문들이다. 특히나 Redux를 사용한 경험과, Typescript를 사용한 경험은 모든 회사에서 물어보았다. 답변이 부족했던 질문에 대해서는 다시 찾아보고 공부하는 과정을 반복하였다. 모든 질문에 완벽하게 답하기란 어렵지만, 분명 미리 대비하고 면접을 임한다면 후회없이 면접을 볼 수 있을것이다. [일반]..

Others 2022.11.30

HTTP 응답 상태 코드

총 5개 번호대가 존재 Informational responses (100 – 199) Successful responses (200 – 299) Redirection messages (300 – 399) Client error responses (400 – 499) Server error responses (500 – 599) Successful responses (200 – 299) 200 Ok 201 Created: POST, PUT 요청이 보내왔을 때 204 No content : 바디가 없을 때 (헤더는 존재할수도) Client error responses (400 – 499) 400 Bad request: 서버가 요청을 이해할 수 없음 401 Unauthorized: 비인증(unauthenti..

Others 2022.11.13

캐시란 무엇인가?

컴퓨터에서 memory 컴퓨터 구성: CPU- Memory- Disk Disk: 파일이 저장 CPU: 파일을 실행 Memory: 파일 저장의 일부가 저장 Cache: CPU 안에 고속 메모리 메모리도 빠르지만, 그것보다 더 빠르게 실행하기 위해서 CPU안에 탑재를 시킴 브라우저에서 file 브라우저에 저장되어 있는 파일들을 로컬PC에 저장하는 걸 cache되어 있다라고 표현 목적: 다시 웹 서버로 접속해서 가져오는 시간을 줄이기 위해 (로딩을 빠르게 하기위해) 한번 다녀온 웹 사이트들의 이미지를 특정 기간동안 로컬에 저장하는 것 단점: 이미지를 서버에서 바꿨는데, 브라우저에서 바꿀수 있는 주기가 아니라면 예전 이미지가 보이기도 함. 그럴때 cache를 지워보라고함 CDN(Content Delivery N..

Others 2022.11.07

쿠키, 세션, 토큰, JWT

모두 authentication을 위한 것! 쿠키 서버가 데이터를 사용자의 정보(세션 ID)를 기억하기 위해 사용자의 브라우저에 전달하는 방법 *쿠키는 네이티브 앱에는 존재하지 않고, 브라우저에만 존재함 HTTP response를 보낼 때 쿠키를 함께 보냄 브라우저에 쿠키가 저장되면, 그 사이트를 방문할 때 마다 쿠키도 HTTP request에 함께 보내짐 쿠키의 특징 도메인에 따라 정해짐 유효기한이 있음 인증(세션ID) 뿐만 아니라 언어 등 여러가지 정보를 담고 있음 공간 제약이 있음 세션과 토큰이 왜 필요한가? HTTP는 stateless이기 때문. 서버로 가는 모든 요청이 독립적으로 다루어짐. 요청끼리의 연결도 없고, 메모리도 없음 그래서 서버에 요청'할 때마다' 우리가 누구인지 알려주어야 함 ->..

Others 2022.11.07