본문 바로가기

전체 글

(56)
[js] arrow function 규칙 //기존의 function sample var double = function(x){ return x*2;} //arrow function sample const double = (x) => { return x*2;} //매개변수가 1개인 경우 소괄호 생략 가능 const double = x => {return x*2} //함수가 한줄로 표현가능하면 중괄호 생략 가능하고 자동으로 return됨 const double = x => x * 2 //매개변수가 두 개 이상일 때 const add = (x,y) => x + y //매개변수가 없을 때 () => { ... } //객체변환할 때 중괄호 사용 () => {return {a:1};} //return 바로할땐 소괄호 사용 () => ({a:1}) 출처: ..
webpack > scss build failed 작업물 : 노마드코더 > 유튜브 클론 > webpack 강의 에러 키워드 : module build failed (from ./node_modules/extract-text-webpack-plugin/dist/loader.js): 원인 : webpack 4는 extract-text-webpack-plugin 사용할 수 없으므로 mini-css-extract-plugin 사용하여야 한다 :warning: Since webpack v4 the extract-text-webpack-plugin should not be used for css. Use mini-css-extract-plugin instead. :warning: For webpack v1, see the README in the webpack-1..
https://velog.io/@mollang/series 공부 일지들과 to-do-list들
[js] 삼항연산자 목표 : 삼항연산자를 사용해서 class "red" 를 갖고 있는 태그들은 red 라는 텍스트가 찍히게 해보자 html aaa bbb ccc ddd eee eee 나나 css .red {color:red;} .blue {color:blue;} js let li = document.querySelectorAll("li"); li.forEach(function(item){ // if(item.classList.contains("red")){ // item.innerHTML="red" // } item.classList.contains("red") ? item.innerHTML="red" : console.log("?") }); 삼항연산자를 쓰면, if( 조건문 ) { 조건문 결과 } else { 조건문 외의..
[js] filter filter 함수를 활용해 배열에서 조건에 해당하는 값만 추출해 낼 수 있다. (function test(){ const testArray = [1,2,3,4]; function getThreeUnder(value){ return value
[js] localStorage 에 저장된 값을 화면에 출력 2 * 이 게시판은 배운 것을 간단하게 혼자 다시 짜보는 곳 목표: 입력한 값이 화면에 출력이 되고, 새로고침이나 페이지 전환을 해도 그 값이 유지. const form = document.querySelector('.js-form'); const input = form.querySelector('input'); const greeting = document.querySelector('.js-greetings'); const GREETING_LS = "currentStorage"; const SHOWING_CN = "showing"; // 4. saveName 함수로 localstorage 에 input 값을 저장 function saveName(t){ localStorage.setItem(GREETING_..
[js] localStorage 에 저장된 값을 화면에 출력 1 * 이 게시판은 배운 것을 간단하게 혼자 다시 짜보는 곳 목표: 바닐라자바스크립트로 localStorage 에 저장된 값을 화면에 출력 html javascript const form = document.querySelector('.js-form'); const input = form.querySelector('input'); const greeting = document.querySelector('.js-greetings'); const GREETING_LS = "currentStorage"; const SHOWING_CN = "showing"; function paintText(text){ greeting.classList.add(SHOWING_CN); greeting.innerHTML = `Hell..
[react] axios, yts api 목표: yts api 가 제공하는 최신 영화 데이터를 axios로 받아 화면에 그려줄 것이다. import React from "react"; import './App.css'; class App extends React.Component { state = { isLoading : true, movies : [] }; componentDidMount(){ }; render(){ const {isLoading } = this.state; return {isLoading ? "Loading..." : "we are reay"} }; }; export default App; 이전 게시글 소스에 이어서 yts api 가 제공하는 최신 영화 데이터를 axios로 받아 화면에 그려줄 것이다. (*https://yt..