본문 바로가기

분류 전체보기301

JSX 문법 [정의] JSX는 JavaScript XML이다. JSX문법은 리액트에서 사용되는 문법으로써 리액트가 사용자에게 읽기 편한 형태(HTML Tag)로 변환해주는 문법이다. [사용법] 1. JSX문법은 닫힌 태그가 필요하다. or 반드시 하나의 엘리먼트로 감싸야 한다. 즉, 부모가 반드시 존재해야 한다. ㄴdiv를 많이 사용할 경우 코드가 꼬이거나 가독성이 불편하다. 로 감싸주자. (Fragment를 사용하기 위해서는 import React, { Component, Fragment } from 'react';) 처럼 import해와야 한다. 2. 변수에 데이터를 전달할 수 있다. (자바스크립트 값 사용) **JSX 문법은 중괄호 표기법을 사용하여 변수를 동적으로 출력할 수 있다. class App exten.. 2020. 8. 28.
ES6: 구조분해 할당(Destructuring) https://ko.javascript.info/destructuring-assignment#ref-70 구조 분해 할당 ko.javascript.info const candyMachine = { status: { name: "none", count: 5, }, getCandy(){ this.status.count--; return this.status.count; } [객체 분해하기] 1. 기본 문법 let { var1, var2} = { var1 : …, var2 : … } 예시#1: let options = { title : "Menu", width : 100, height : 200 }; → ① let { title, width, height } = options; 또는 ② let { width .. 2020. 8. 28.
IE용 주석을 이용한 방법 (Conditional comments) & 크로스 브라우징 [[배운 것들]] ** 크로스브라우징 (https://webdir.tistory.com/451) IE용 주석을 이용한 방법 (Conditional comments) lt = less than 미만 lte = less than equal to 이하 gt = greater than 초과 gte = greater than equal to 이상 [if (gt ie 6)&(lt ie 9)] ie 6 이후버전이고 ie 9 이전버전 이라면 [if (ie 6)|(ie 8)] ie 6 이거나 ie 8 이라면 [If !(ie 8)] ie 8 이 아니라면 ** IE가 문서를 읽고 랜더링 할 때 원하는 모드로 랜더링을 하게 해준다. 만약 content에 값이 "IE=edge"라면 해당브라우저가 할 수 있는 가장 최신의 모드로.. 2020. 8. 20.
browser detect 코드 브라우저 detect!! 2020. 8. 20.
선택자: querySelector('') 매서드 [feat. 생활코딩, 바위처럼] 참고영상: https://www.youtube.com/watch?v=heH2ppuZQco&list=PL-qMANrofLyvzqz2yYzNectJnYo5ZifE7&index=9&t=0s 참고영상: https://www.youtube.com/watch?v=fRGtrlQemhs const li = document.getElementsById('') const li = document.getElementsByClassName('') const li = document.getElementsByTagName('') ★배열 + 반복문 const li = document.querySelector('li) ★1나의 엘리먼트를 선택 const li = document.querySelectorAll('li) ★배열 + 반복.. 2020. 8. 7.
퍼블리셔가 알아야 할 필수 사이트 11선 1. HTML LIVING STANDARD (https://html.spec.whatwg.org/multipage/) ㄴw3c에서 제공하는 HTML 스펙 제공. 2. WCAG2.1 GUIDELINES (https://www.w3.org/TR/WCAG21/) ㄴ국제 접근성 가이드 3. 웹접근성 연구소 (https://www.wah.or.kr:444/) ㄴ국내 접긍성 가이드 4. 접근성 향상 WAI-ARIA ㄴ 5. W3CSchool (https://www.w3schools.com/) 6. DEVELOPER MOZILLA (https://developer.mozilla.org/ko/) 7. CAN I USE (https://caniuse.com/) ㄴ호환성 검사 8. W3C VALIDATOR (https:/.. 2020. 8. 1.