웹의 프론트엔드 기술인 HTML, CSS, JavaScript를 웹에서 작성해서 바로 테스트 해볼 수 있고, 그 소스를 저장 공유할 수 있는 서비스이다.

 

https://jsfiddle.net/user/mill01/fiddles/

 

Settings - JSFiddle - Code Playground

 

jsfiddle.net

Posted by 홍반장水 홍반장水

댓글을 달아 주세요

Vue(/vjuː/ 로 발음, view 와 발음이 같습니다.)는 사용자 인터페이스를 만들기 위한 프로그레시브 프레임워크 입니다. 다른 단일형 프레임워크와 달리 Vue는 점진적으로 채택할 수 있도록 설계하였습니다. 핵심 라이브러리는 뷰 레이어만 초점을 맞추어 다른 라이브러리나 기존 프로젝트와의 통합이 매우 쉽습니다. 그리고 Vue는 현대적 도구  지원하는 라이브러리와 함께 사용한다면 정교한 단일 페이지 응용프로그램을 완벽하게 지원할 수 있습니다.

Vue를 알아보기 전에 Vue에 대해 자세히 알고 싶다면 핵심 원칙과 샘플 프로젝트를 바탕으로 설명하는 비디오를 만들었으니, 참고하시면 좋을 것 입니다.

이미 숙련된 프론트엔드 개발자이고 Vue를 다른 라이브러리/프레임워크와 비교하고 싶다면 다른 프레임워크와의 비교를 확인하십시오.

 

https://kr.vuejs.org/v2/guide/index.html

 

시작하기 — Vue.js

Vue.js - 프로그레시브 자바스크립트 프레임워크

kr.vuejs.org

 

Posted by 홍반장水 홍반장水

댓글을 달아 주세요

React - 사용자 인터페이스를 만들기 위한 JavaScript 라이브러리

 

https://ko.reactjs.org/

 

React – 사용자 인터페이스를 만들기 위한 JavaScript 라이브러리

A JavaScript library for building user interfaces

ko.reactjs.org

 


https://github.com/facebook/react/

 

facebook/react

A declarative, efficient, and flexible JavaScript library for building user interfaces. - facebook/react

github.com

 

Posted by 홍반장水 홍반장水

댓글을 달아 주세요

2019년과 이후 JavaScript의 동향 - JavaScript(ECMAScript)

https://d2.naver.com/helloworld/4007447

Posted by 홍반장水 홍반장水

댓글을 달아 주세요

ECMA Script 6? 버전 특징

 

ES 2015 (ES 6)


1. let, const 키워드 추가
기존의 변수는 함수 scope를 가진 var 키워드를 이용하여 선언하였다. 때문에 block scope 를 가진 let과 const 키워드를 추가하였다. 기존에는 상수형 키워드가 없어 CONST_TEST와 같이 대문자로 상수임을 표시했다면, ES 6부터 const 키워드가 추가되어 값의 변경을 통제한다.

2. arrow 문법 지원
arror 문법은 두 가지의 장점을 제공한다. 첫 번째는 익숙하면 편하고 간결해진 코드를 작성할 수 있다. 두 번째는 this 를 바인딩하지 않는다. (다르게 말하면, this는 해당 scope의 this와 같다.)
두 번째 this를 바인딩 하지 않는다는 코드로 설명하겠다. 우선 아래 코드를 보자. test 객체에 name변수와 fn이라는 메소드를 두었다. 아래 test.fun으로 메소드를 실행한다.

3. iterator / generator 추가
위 arrorw에서 샛길로 빠져서 더 새진 않겠습니다. 이 둘은 따로 공부해서 글을 쓸 정도로 내용이 깊고 많습니다.

4. module import / export 추가
사실 저는 익숙하고 당연하게 import / export를 써 왔는데 도입된 시점이 그리 오래되지 않았다는 것에 잠깐 놀라네요.

5. Promise 도입
자바스크립트의 비 동기 callback hell을 해결해 줄 기법이 추가 되었습니다.

ECMA 2017 (ES 8)

사실 ECMA 2017 까진 정리하지 않으려 했는데, 보던 중 반가운 기능이 추가되어 소개 합니다.
async — await
위에서 ES6에서 callback hell을 해결하기 위해 Promise가 도입되었다고 했는데 async-await도 Promise처럼 callback 을 해결할 뿐만 아니라 좀 더 직관적이고 단순하게 코드를 만들 수 있습니다.
Posted by 홍반장水 홍반장水

댓글을 달아 주세요

https://www.w3schools.com/howto/howto_css_switch.asp

How To Create a Toggle Switch

www.w3schools.com

How TO - Toggle Switch


Posted by 홍반장水 홍반장水

댓글을 달아 주세요

Angular 2 대신에 Vue.js를 선택한 이유 (그리고 React를 선택하지 않은 이유)

https://joshua1988.github.io/web-development/translation/why-we-moved-from-angular2-to-vuejs/

 

Angular 2 대신에 Vue.js를 선택한 이유 (그리고 React를 선택하지 않은 이유)

(번역) 실제 프로젝트에서 고민한 프레임워크 선정 과정과 Angular, React, Vue 의 비교

joshua1988.github.io

Posted by 홍반장水 홍반장水

댓글을 달아 주세요

물품을 구매한 경우 취소 를 클릭하여 중복 거래를 방지해야 합니다

 

 

opener.location.reload() 대신
window.opener.location.href = window.opener.location.href;  혹은
window.opener.location.href = window.opener.document.URL; 로 설정해준다.

 

 

 경고창
ie
익스플로러

 

Posted by 홍반장水 홍반장水

댓글을 달아 주세요

https://jsfiddle.net/

 

Create a new fiddle - JSFiddle

 

jsfiddle.net

웹의 프론트엔드 기술인 HTML, CSS, JavaScript를 웹에서 작성해서 바로 테스트 해볼 수 있고, 그 소스를 저장 공유할 수 있는 서비스이다.

 

https://jsfiddle.net/user/mill01/fiddles/

 

kim hongwan's Fiddles - JSFiddle - Code Playground

 

jsfiddle.net

Posted by 홍반장水 홍반장水

댓글을 달아 주세요

javascript, nl2br, nl to  


function nl2br(str){  
    return str.replace(/\n/g, "<br />");  
}   

function nl2nbsp(str){   
    return str.replace(/\n/g, "");  
}   

'프로그래밍 > jQuery & Javascript' 카테고리의 다른 글

JSON Editor Online  (0) 2019.11.26
[jQuery] AJAX Cross Origin plugin  (0) 2019.10.21
javascript, nl2br, nl to &nbsp;  (0) 2019.09.11
[jQuery] touch event 체크  (0) 2019.08.19
jQuery 화면전환 효과 참고 사이트  (0) 2019.08.02
[javascript] Switch case else  (0) 2019.07.31
Posted by 홍반장水 홍반장水

댓글을 달아 주세요