웹 브라우저란? ● 인터넷 브라우저라고도 불리며, 웹 서버로부터 정보를 요청하고 받아 사용자에게 보여주는 소프트 웨어입니다. ● 웹 브라우저는 HTML, CSS, Js파일을 전달받아 해석하게 되는데 정적인 페이지인 HTML,CSS,Js는 서버에 브라우저로 전송되는 그대로 표시되지만, 동적 웹페이지는 서버로부터 데이터를 받아 브라우저가 실시간으로 내용을 생성하고 변경합니다. 웹의 동작 원리 ①,② 사용자가 웹 브라우저의 주소창에 URL을 입력합니다. ③ 사용자가 입력한 URL주소 중에서 도메인 네임(Domain Name)부분을 DNS(Domain Name System)서버에서 검색합니다. ④ DNS 서버에서 해당 도메인 네임에 해당하는 IP주소를 찾아 사용자가 입력한 URL정보와 함게 전달합니다. ⑤,⑥ ..
제대로된 경로에 yarn을 install했는데도 보안 오류가 뜹니다. 이런 경우는 스크립트를 실행할 권한이 없을 때 생기는 오류입니다. 해결법 0. 관리자 권한으로 windows PowerShell을 킵니다. 1. 권한을 확인합니다. get-ExecutionPolicy 2. 권한을 RemoteSigned로 바꿔줍니다. Set-ExecutionPolicy RemoteSigned 3. 다시 권한을 확인해보면 바뀐걸 확인 할수 있습니다. 4. vs코드로 돌아가 다시 확인해보면 버전이 잘 출력되는걸 확인 할 수 있습니다.
프로젝트 소개 Bingle Movie Bingle Movie 프로젝트란? 영화api를 활용하여 간단하게 영화의 리뷰를 작성하여 의견을 작성하고시각적인 즐거움을 경험할수 있도록 구현 하였습니다. 사용자에게 인상깊은 ux를 주기 위하여 화려한 효과들을 주어 기억에 남는 페이지를 구현 하고자 만든 프로젝트입니다. 진행 과정 바닐라 자바스크립트를 사용하여 전부 구현하였습니다. 또한 three.js를 사용하여 3D이미지를 입체적으로 볼수 있도록하여 보는 즐거움이 있도록 하였으며 TMDB API를 사용하여 영화 목록을 가져와서 정렬하고 보여지도록 하였습니다. localStorage를 사용하여 리뷰를 저장하고 새로고침해도 사라지지 않도록 하였습니다. KPT KEEP - 좋았던점 PROBLEM - 아쉬웠던 점 TRY ..
문제설명 프로그래머스 모바일은 개인정보 보호를 위해 고지서를 보낼 때 고객들의 전화번호의 일부를 가립니다. 전화번호가 문자열 phone_number로 주어졌을 때, 전화번호의 뒷 4자리를 제외한 나머지 숫자를 전부 *으로 가린 문자열을 리턴하는 함수, solution을 완성해주세요. 제한조건 phone_number는 길이 4 이상, 20이하인 문자열입니다. 입출력 예시 phone_number return "01033334444" "*******4444" "027778888" "*****8888" 나의 풀이 function solution(phone_number) { let numberArr = phone_number.split('') for (let i = 0; i < numberArr.length-4;..
목표 1. 버튼을 누르면 해당 하는 조건으로 데이터 정렬 2. 정렬된 데이터를 다른 페이지로 가져가서 뽑아내기 3. 기능들 함수화 시키기 이룬것 1. 버튼을 누르면 해당 하는 조건으로 데이터 정렬 • 버튼을 누르면 if문에서 조건을 판별 할 아이디 가져오기 - HTML의 요소에 id를 주고 addEventListener를 사용하여 버튼을 누르면 해당 아이디를 가져올수 있도록 구성하였습니다. maintitle_Container.addEventListener('click', function (e) { const buttonId = e.target.id; } - 이 버튼의 id값을 사용해서 미리 출력할 값들을 저장 및 정렬까지하고 페이지를 이동해서 출력만 하면 좋을것 같다고 생각하였습니다. - 위 함수의 스코..
클로저란? 주변 상태(어휘적 환경)에 대한 참조와 함께 묶인(포함된) 함수의 조합입니다. 즉, 클로저는 내부 함수에서 외부 함수의 범위에 대한 접근을 제공합니다. JavaScript에서 클로저는 함수 생성시 함수가 생성될 때마다 생성됩니다. - MDN 쉽게말해서 이미 생명 주기가 끝난 외부 함수의 변수를 참조하는 함수입니다. 함수 내부에 함수가 존재할 경우 const name = 'start' // name은 전역변수 function func1() { var name = "coriny"; // name은 func1 의해 생성된 지역 변수이다. function func2() { // func2() 은 내부 함수이며, 클로저다. console.log(name); // coriny 즉, 부모 함수에서 선언된 ..
Promise는 해석하면 '약속' 즉, 비동기 처리에 대해, 처리가 끝나면 알려달라는 약속입니다. 비동기 처리 • 특정 코드의 실행이 완료될 때까지 기다리지 않고 다음 코드를 먼저 수행하는 자바스크립트의 특성 자바 스크립트는 비동기 처리를 위한 하나의 패턴으로 콜백함수를 사용하였지만 에러의 처리가 곤란하고 콜백지옥으로 인해 가독성도 떨어지고 여러개의 비동기 처리를 한번에 처리하는데 한계가 있었습니다. Promise는 이러한 비동기 처리를 위한 객체이며 전통적인 콜백 패턴이 가진 단점을 보완하고 비동기 처리의 성공 또는 실패와 같은 최종결과를 명확하게 표현할수가 있습니다. Promise의 기본 구조 const myPromise = new Promise((resolve, reject) => { // 비동기 ..
Large files detected. You may want to try Git Large File Storage에러 이런 에러가 뜨면서 파일 용량에 관한 메세지가 뜰텐데 깃허브는 100MB이하의 파일만 올릴수 있다고 합니다. video와 함께 깃허브에 올릴것이기 때문에 파일을 함께 올렸어야 했습니다. 비디오를 압축도 해보고 다 했지만 안되서 구글링을 하다가 방법을 찾았습니다. 1. 일단 commit을 한상태이기 때문에 에러났을때의 커밋 기록을 지워줍니다. 2. git log로 기록을 확인한뒤 git log 3. 커밋 내역을 지워줍니다. (HEAD~5는 5개의 기록을 삭제 하겠다는것.) git reset --mixed HEAD~5 4. lfs를 설치합니다. git lfs install 5. 관리하고 싶..