본문 바로가기

전체 글

[ETC] 웹 브라우저의 전쟁 (크롬의 등장) 서사자바스크립트가 왜 만들어졌을까? 바로 웹 페이지의 엘리먼트요소를 동적으로 만들고 싶어서였다. 그리고 가장 처음 인터넷을 대중화시킨 브라우저는 무엇일까? 바로 넷스케이프아라는 회사의 모자이크라는 브라우저가 최초였다.  인터넷 익스플로러의 등장 그에 비해 2년 뒤에 출시한 마이크로소프트의 인터넷 익스플로러는 넷스케이프에 비해 뛰어난 기술력을 갖추고 있는 건 아니었다. 심지어 초기 인터넷 익스플로러 1.0은 기술력 부족으로 경쟁사인 넷스케이프에게 라이센스 비용을 지불하고 만들어야 했다. 하지만 사업가 빌게이츠는 꽤나 심박한 마케팅 전략을 내세우며 '인터넷 익스플로러'는 브라우저 시장의 1등 점유율의 타이틀을 얻게 된다.첫번째 성공 요인은 전면 무료화였다. 넷스케이프는 모자이크 브라우저가 회사의 핵심 비즈니.. 더보기
[암호화] RSA 암호화 정리 ✨ 💻 암호화 종류대칭 암호화동일한 키 사용예) 고급 암호화 표준(AES)비대칭 암호화 (RSA)암호화에는 공개 키, 복호화에는 개인 키📌 공개키 기법 (비대칭 암호) - RSA암호화RSA의 이니셜은 처음 알고리즘은 공개한 수학자 이름(Rivest Shamir Adleman)대칭키 암호화와 달리 공개키와 비밀키 서로 다른 두개를 사용하여 암호화 및 복호화공개키: 누구나 알아도 되는 키비밀키: 소유자만 아는 키공개키 암호화 → 비밀키 복호화비밀키 암호화 → 공개키 복호화대칭키 암호화 보다 리소스를 많이 사용하고 효율성이 떨어지기 때문에 메시지나 전체 파일을 암호화 하는 데에는 적합하지 않는다.SSH 같은 많은 프로토콜은 RSA 암호화 및 보안 시그니처 기능에 사용된다.📝 공개키 암호화 예시공개키는 누구나.. 더보기
[자바스크립트] string 메서드 정리 ✨ `concat()`매개변수로 전달된 모든 문자열을 호출 문자열에 붙인 새로운 문자열로 반환const str1 = 'hello'const str2 = 'world'str1.concat(' ', str2) `includes()`하나의 문자열이 다른 문자열에 포함되어 있는지 판별결과를 true false로 반환const sentence = 'The quick brown fox jumps over the lazy dog.';const word = 'fox';sentence.includes(word) ? 'is' : 'is not' `indexOf()``string` 객체에서 주어진 값과 일치하는 첫번째 인덱스를 반환값이 없으면 -1로 반환const paragraph = "I think Ruth's dog is .. 더보기
[자바스크립트] 제너레이터 함수, 이터러블 객체 ✨ 📝 function*generator 객체를 반환제너레이터는 중간에 원하는 부분에서 멈추거나, 그 부분부터 다시 실행하는 능력을 가진 함수즉시 실행되지 않고, 함수를 위한 iterator 객체가 반환iterator의 next() 메서드를 호출하면 genrator 함수가 실행되어 yield 문을 만날 때까지 진행하고, 해당 표현식이 명시하는 iterator로부터의 반환값을 반환yield* 표현식을 마주칠 경우, 다른 generator 함수가 위임되어 진행된다.이후 next() 메서드가 호출되면 진행이 멈췄던 위치에서부터 재실행된다.next()가 반환하는 객체는 yield 문이 반환할 값을 나타내는 value 속성과 generator 함수 안의 모든 yield 문의 실행 여부를 표시하는 boolean 타입.. 더보기
[Redux] Redux 문법 🔍 reducer💻 action과 reduceraction은 store로 운반할 데이터를 말한다. 상태 변화를 담은 객체이 액션이 reducer라는 함수로 전달 되고 이 함수가 넘겨 받은 action은 가지고 새로운 state를 만든다.action → reducer → storelet user = createSlice({ name: 'userName', initialState: 'brgndy', reducers: { changeName(state) { return state + 'jeon'; } }})reducer를 이용해서 changeName이라는 함수를 만들어 주었다.저 매개변수로 들어간 state는 기존에 있던 초기 state 값이다. 💻 reducer로 만든 함수 .. 더보기
[CSS] CSS selector 정리 ✨ 참고자료1 CSS 선택자 - CSS: Cascading Style Sheets | MDNCSS 선택자는 CSS 규칙을 적용할 요소를 정의합니다.developer.mozilla.org ✨CSS 선택자 📕 기본 선택자💻 전체 선택자* { color: green;}  💻 유형 선택자💻 클래스 선택자💻 ID 선택자 💻 특성 선택자 ⭐️- `[attr]` : 이름의 특성을 가진 요소를 선택- `[attr=value]`: attr이라는 이름의 특성값이 정확히 value인 요소를 선택함- `[attr~=value]` : 이름의 특성값이 정확히 value인 요소를 선택. 공백으로 구분한 여러 개의 값을 가지고 있을 수 있음- `[attr|=value]` : attr이라는 특성값을 가지고 있으며 정확히 va.. 더보기
[자바스크립트] math 메서드 정리 ✨ 참고자료1 [JS] 📚 자바스크립트 Math 메소드 💯 총정리자바스크립트 Math 메소드 Math 객체는 수학 상수와 함수를 위한 프로퍼티와 메소드를 제공하는 빌트인 객체이다. Math 객체는 생성자 함수가 아니다. 따라서 Math 객체는 정적(static) 프로퍼티와 메inpa.tistory.com  ✨ math method 💻 math.abs(number)- 인수의 절댓값 반환math.abs(-1); //1math.abs('-1'); //1math.abs(''); //0math.abs([]); //0math.abs(null); //0math.abs(undefined) //0   💻math.round(number): number- 인수의 소수점 이하를 반올림하는 정수를 반환math.round(1.. 더보기
[Git] merge와 rebase 정리 ✨ 참고자료  ✨ rebase- 브랜치의 base를 재설정한다는 의미- branch의 base란 branch가 뻗어나오는 시작점을 base이다.   💻 예시를 살펴보자!- dev 브랜치에서 branch1에는 commit 1, 4가 있고, branch2에는 commit 2, 3이 있다.    - 브랜치 두개를 머지시켜보자git merge dev branch1git merge dev branch2- commit graph가 꼬여있다.- 동시에 작업한 브랜치가 여러개 존재하고, 한번에 변경사항을 파악하기 어렵다.   - rebase는 어떨까?- 일단, `merge --no-ff` 시켜보자📌 `merge --no-ff`- 새로운 병합 커밋 생성 = fast-forward(새로운 병합 커밋 생성하지 않고 브랜치 .. 더보기

티스토리툴바