본문 바로가기
반응형

JS37

[React] : JavaScript 자료형 중 원시 타입과 비 원시 타입 JS 자료형 Primitive Type, 원시 타입 : 한 번에 하나의 값만 가질 수 있고 하나의 고정된 저장 공간을 사용한다. ex) let number = 12; Non-Primitive Type, 비 원시 타입 : 한 번에 여러 개의 값을 가질 수 있고 여러 개의 고정되지 않은 동적 공간을 사용한다. ex) let array = [1,2,3,4]; JS는 정수, 실수로 구분하지 않는다. 숫자로 구분한다. 2022. 3. 30.
[React] : React와 JavaScript에 대해서.. React란 무엇인가? : 페이스북에서 만들었고 인스타그램, 페이스북, 넷플릭스 등 여러 기업들이 사용하고 있다. React를 배워서 무엇을 만들 수 있나? : React 파생 기술인 React Native(데스크탑, Android, IOS 에서 동작하는 어플리케이션)을 쉽게 배울 수 있다. React를 어떻게 배워야 하나? : React는 근본적으로 JS의 라이브러리이다.React의 동작 환경은 Node.js이다. JS -> Node.js -> React.js 순이다. HTML은 요소들의 배치와 내용을 기술하는 언어, 색이나 크기 등 디자인을 수행한다.(서식에 해당한다.) CSS3는 요소들의 색, 크기, 애니메이션을 정의한다. 즉, 스타일링을 위한 언어이다. JavaScript는 웹 사이트에 동작을 주.. 2022. 3. 30.
[JavaScript 30일 챌린지] : 30일차 두더지 게임을 만드는 미니 프로젝트였다. 2022. 2. 26.
[TIL] : 122 일일 배움을 위한 Today I Learned ! Spring Boot 서블릿 예외 처리에 대해 공부했다. 오류 화면을 제공하고 오류 페이지 작동 원리와 필터, 인터셉터에 대해 실습을 진행했다. 2022.02.25 - [Framework/Spring Boot] - [Spring Boot] : 서블릿 예외 처리 오류 화면 제공 기능 구현하기 2022.02.25 - [Framework/Spring Boot] - [Spring Boot] : 서블릿 예외 처리 오류 페이지 작동 원리 2022.02.25 - [Framework/Spring Boot] - [Spring Boot] : 서블릿 예외 처리 필터 2022.02.25 - [Framework/Spring Boot] - [Spring Boot] : 인터셉터 예.. 2022. 2. 25.
[JavaScript 30일 챌린지] : 29일차 let countdown; const timerDisplay = document.querySelector('.display__time-left'); const endTime = document.querySelector('.display__end-time'); const buttons = document.querySelectorAll('[data-time]'); function timer(seconds) { // clear any existing timers clearInterval(countdown); const now = Date.now(); const then = now + seconds * 1000; displayTimeLeft(seconds); displayEndTime(then); countdo.. 2022. 2. 25.
[JavaScript 30일 챌린지] : 28일차 저번에 진행했던 동영상 속도 관련 조절하는 것을 이번에는 수직바에 마우스로 속도를 조절하는 프로젝트를 만들었다. 2022. 2. 24.
[JavaScript 30일 챌린지] : 27일차 세로 스크롤이 아닌, 가로 스크롤을 통해 내용을 확인할 수 있는 프로젝트였다. 그냥 스크롤 뿐만 아니라 클릭후 드래그하는 방식으로도 페이지를 이동시킬 수 있었다. 2022. 2. 23.
[JavaScript 30일 챌린지] : 26일차 마우스를 올리면 dropdown 방식으로 메뉴가 펼쳐지는 프로젝트이다. 홈페이지를 돌아다니다 보면 많이 보이는 방식인데 메뉴에 따라 크기도 알아서 바뀌는 모습을 볼 수있다. 2022. 2. 22.
[TIL] : 118 일일 배움을 위한 Today I Learned ! Docker 도커 컨테이너 CPU 제한과 이미지에 대해서, 그리고 이미지를 생성하는 방법을 공부했다. 2022.02.21 - [Server & System/Docker] - [Docker] : 도커 컨테이너 CPU 제한 / --cpu-shares 활용하기 2022.02.21 - [Server & System/Docker] - [Docker] : 도커 컨테이너 CPU 제한 / --cpuset-cpu 활용하기 2022.02.21 - [Server & System/Docker] - [Docker] : 도커 컨테이너 CPU 제한 / --cpu-period, --cpu-quota 활용하기 2022.02.21 - [Server & System/Docker] - [D.. 2022. 2. 21.
[JavaScript 30일 챌린지] : 25일차 Event Capture, Propagation, Bubbling and Once에 대한 프로젝트이다. Bubbling은 요소의 이벤트가 시작되면 부모 요소부터 쭉 동작하게 된다. 마치 거품이 물 속에서 위로 올라가는 것과 비슷하다. once:true를 주면서 1회만 실행이 되도록 설정했다. 📝 이 페이지를 참고해서 공부했다. 2022. 2. 21.
[TIL] : 117 일일 배움을 위한 Today I Learned ! docker fluentd 로깅에 대해 실습을 진행했는데 아직 익숙하지 않다. 2022.02.20 - [Server & System/Docker] - [Docker] : fluentd 로깅 JavaScript 30일 챌린지 JS 30일 챌린지 마무리하고 있는 중이다. 2022.02.20 - [Project/JavaScript 30일 챌린지] - [JavaScript 30일 챌린지] : 24일차 2022. 2. 20.
[JavaScript 30일 챌린지] : 24일차 24일차 html { box-sizing: border-box; background: #eeeeee; font-family: 'helvetica neue'; font-size: 20px; font-weight: 200; } body { margin: 0; } *, *:before, *:after { box-sizing: inherit; } .site-wrap { max-width: 700px; margin: 70px auto; background: white; padding: 40px; text-align: justify; box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.05); transform: scale(0.98); transition: transform 0.5s; } bo.. 2022. 2. 20.
[TIL] : 116 일일 배움을 위한 Today I Learned ! Docker docker log에 관해 공부했다. 여러 페이지를 공부했는데 실습한 내용만 올려보기로 했다. 2022.02.19 - [Server & System/Docker] - [Docker] : JSON-FILE Log 사용하기 JavaScript 30일 챌린지 23일차 2022.02.19 - [Project/JavaScript 30일 챌린지] - [JavaScript 30일 챌린지] : 23일차 2022. 2. 19.
[JavaScript 30일 챌린지] : 23일차 텍스트 메시지를 읽어주는 프로젝트를 만들었다. 읽는 속도를 조절할 수 있고 멈추기 기능도 만들어줬다. 2022. 2. 19.
[JavaScript 30일 챌린지] : 20일차 20일차 window.SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition; const recognition = new SpeechRecognition(); recognition.interimResults = true; recognition.lang = 'en-US'; let p = document.createElement('p'); const words = document.querySelector('.words'); words.appendChild(p); recognition.addEventListener('result', e => { const transcript = Array.from(e.results) .map.. 2022. 2. 16.
[TIL] : 112 일일 배움을 위한 Today I Learned ! Docker 컨테이너 애플리케이션 구축과 도커 볼륨에 대해 공부했다. 도커 볼륨을 활용하는 부분도 천천히 코딩해 볼 생각이다. 2022.02.15 - [Server & System/Docker] - [Docker] : 도커 애플리케이션 구축하기 2022.02.15 - [Server & System/Docker] - [Docker] 도커 볼륨, docker volume JavaScript 30일 챌린지 19일차를 진행했다. 웹 캠을 보이게하고 사진을 찍고 효과를 주게끔 만드는 코드였는데 이해가 잘 가지 않는다. 일단 1차 목표는 JS 문법과 친해지는 것이 목표인데 애매한 것 같다. 2022.02.15 - [Project/JavaScript 30일 챌린지] .. 2022. 2. 15.
[JavaScript 30일 챌린지] : 19일차 function getVideo() { navigator.mediaDevices.getUserMedia({ video: true, audio: false }) .then(localMediaStream => { console.log(localMediaStream); video.srcObject = localMediaStream; video.play(); }) .catch(err => { console.error(`OH NO!!!`, err); }); } function paintToCanvas() { const width =video.videoWidth; const height =video.videoHeight; canvas.width = width; canvas.height = height; return.. 2022. 2. 15.
[TIL] : 111 일일 배움을 위한 Today I Learned ! Spring Boot 스프링 부트 강의를 마저 듣고 있다 Bean Validation에 관한 내용을 공부하고 있다. 2022.02.14 - [Framework/Spring Boot] - [Spring Boot] : Bean Validation 소개 및 스프링 적용하기 JavaScript 30일 챌린지 18일차 코딩을 했다. 아직은 JS에 익숙해 지는 것이 목표이다. 2022.02.14 - [Project/JavaScript 30일 챌린지] - [JavaScript 30일 챌린지] : 18일차 2022. 2. 14.
[JavaScript 30일 챌린지] : 17일차 17일차 스크립트 부분 코드이다. 이번에는 정렬을 했는데 족므 특이한 정렬이다. sort()를 사용했는데 관사(a, an, the)를 제외하고 정렬했다. replace로 변경될 문자열과 변경할 문자열을 지정해서 a, an, the를 바꿔주었다. 2022. 2. 13.
[TIL] : 109 일일 배움을 위한 Today I Learned ! JavaScript 30일 챌린지 16일차 마우스 이펙트 처리를 코딩했다. 2022.02.12 - [Project/JavaScript 30일 챌린지] - [JavaScript 30일 챌린지] : 16 2022. 2. 12.
[JavaScript 30일 챌린지] : 16일차 16일차 마우스를 움직여 글자의 그림자를 움직이는 코드를 짰다. 단순하게 글이 있는 것 같지만 마우스를 움직여 보면 글자의 그림자가 분리되어 움직이게 된다. 2022. 2. 12.
반응형