본문 바로가기

Programming

 (12)
[Javascript] 자바스크립트 배열 Array 기능 사용 예시 1. 배열 생성 및 초기화: 배열은 다음과 같이 생성하고 초기화할 수 있습니다. let fruits = ['apple', 'banana', 'orange']; let numbers = [1, 2, 3, 4, 5]; let emptyArray = []; 2. 배열 요소 접근: 배열 요소에 접근하는 방법은 다음과 같습니다. console.log(fruits[0]); // 'apple' console.log(numbers[3]); // 4 3. 배열 길이 확인: 배열의 길이를 확인하는 방법 console.log(fruits.length); // 3 console.log(numbers.length); // 5 4. 배열 요소 추가 및 삭제: 배열에 요소를 추가하거나 삭제하는 방법은 다음과 같습니다. fruits..
[CSS] transition Height auto 일 경우 작동이 되지 않는 현상 리스트를 열 때 슬라이드 애니메이션으로 구현하기 위하여 height를 조정하여 transition을 주려했다. .example { height: auto; transition: all 5s; } .example.act { height: 0; overflow: hidden; transition: all 5s; } 그러나 transition이 제대로 작동하지 않았다..(ㅠ)!!! display block, none 처럼 보였다. 찾아보니 auto 일 경우는 transition 을 적용할 수 없다고..! 결국 아래와 같이 height가 아닌 max-height를 적용하여 slide up, slide down 구현 완료!! 간단한 거지만 꽤 삽질했다..(ㅠㅠ) .example { max-height: 100vh..
[React Native] Http localhost 통신 시 network 오류 host : "http://localhost:8080" 으로 작업하고 있었으나 networkError 발생하였다 이유는 pc localhost와 android localhost는 다르다. 위의 경우는 android localhost를 가르키고 있는 경우이다. 그래서 host : "http://10.0.2.2" 로 변경하였으나 동일한 증상 발생. 이유는 위와 마찬가지로 android localhost를 가르키고 있었다.(emulator에서 통신시에는 위와 같이 사용) 실제 device 연결 하여 확인하고 있었기 때문에 결국 내부아이피로 구동하였다.
[Javascript] HTML5 Web Storage 사용 Web Storage란? HTML5부터 제공하는 기능으로 해당 도메인과 관련된 특정데이터를 서버가 아니라 클라이언트 웹브라우저에 저장할 수 있도록 제공하는 기능이다. 쿠키와 비슷한 기능 Web Stroage가 필요한 이유? 쿠키와 Web Storage 모두 브라우저에 저장되기는 하지만 쿠키는 아래와 같은 단점으로 Web Storage를 사용 4KB의 데이터 저장 제한 HTTP Request에 암호화 되지 않은 상태로 사용하기 때문에 보안에 취약 쿠키는 모든 HTTP Request에 포함되어 있어 웹서비스 성능에 영향을 줄 수 있음 Web Storage의 종류 기존에 우리가 흔히 사용했던 쿠키와 세션처럼 Web Storage도 local Storage와 sessionStorage를 제공한다. Session..
[Javascript] VanillaJS '바닐라'란 프로그래밍 세계에서 기본적인 기능만 구현해 놓은 상태를 의미한다. 그러므로 VanillaJS는 새로운 프레임워크 또는 라이브러리가 아닌 순수한 JavaScript를 의미한다. - url : http://vanilla-js.com/ Vanilla JS Vanilla JS Vanilla JS is a fast, lightweight, cross-platform framework for building incredible, powerful JavaScript applications. Introduction The Vanilla JS team maintains every byte of code in the framework and works hard each day to make sure it is..
[노마드 코더 - VanillaJS] 바닐라 JS로 크롬 앱 만들기 정리 (2) # make your first app 정리입니다. querySelector : 찾는 것 중 첫번째를 가져온다. querySelectorAll : 쿼리셀렉터명에 따른 엘리먼트를 Array로 가지고 온다. getElementsByTagName : 태그명으로 선택한다. - Web Storage sessionStorage : 페이지의 세션이 유지되는 동안 사용할 수 있는 각 origin별로 별도의 storage를 관리한다. (페이지 리로딩 및 복원을 포함한, 브라우저가 열려있는 한 최대한 긴 시간 동안) localStorage : 브라우저가 닫히거나 다시 열리더라도 데이터가 유지 된다. localStorage를 사용하려면 현재 브라우징 세션에서 지원되고 있는지 확인이 필요하다. dataType은 String만..
[Javascript] Console 객체의 메소드 Console 객체는 브라우저의 디버깅 콘솔에 접근할 수 있는 메서드를 제공한다. 동작 방식은 브라우저마다 다르지만, 사실상 표준으로 여겨지는 기능도 여럿 제공 하고 있다. - 콘솔에 텍스트 출력 방법 : 출력하는 메서드로는 console.log(), console.info(), console.warn(), console.error()가 있다. (1) 단일 객체를 출력 var something={name:'ahnlayo',id:10} console.log(something); 출력 화면 (2) 여러 객체를 출력 const car='dodge charger'; const someObject={str:'some text',id:4}; console.info('my first car was a ',car,'...
[노마드 코더 - VanillaJS] 바닐라 JS로 크롬 앱 만들기 정리 (1) 1. var는 사용하지 않는다. 2. 처음엔 const 선언을 필요할 경우에는 let 선언한다. 3. String const word= nomard // -> normard 라는 변수가 없기 때문에 오류 발생. const word2="normard" // -> OK. 4. Boolean const bool=true; const bool=false; 5. Number const num=55; 6. Float const fla=44.1; 7. Array 정렬 Array 안에는 string,boolean,float,number, 변수명도 가능하다. const something="ddd"; const dayOfWeek = ['Mon','Tue','Wed','Thu','Fri','Sat','Sun',true,33..

티스토리툴바