Programming/javascript & HTML2018. 9. 4. 17:32

html내 <script>의 올바른 위치(?)

그래도.. html 요소니까 </body> 이후에 넣긴 그런거 같아서 고민하다가 검색


결론은.. body 전에 넣자 인가?


[링크 : http://jundol.kr/8]

[링크 : http://webdir.tistory.com/514]


일단 여기는 순수 작동하는 자바스크립트가 아니라 외부 스크립트 인것 같은데..

async나 defer를 쓰라고..

<script type="text/javascript" src="path/to/script1.js" async></script>

<script type="text/javascript" src="path/to/script2.js" async></script>


<script type="text/javascript" src="path/to/script1.js" defer></script>

<script type="text/javascript" src="path/to/script2.js" defer></script> 

[링크 : http://dailydev.tistory.com/15]

저작자표시

'Programming > javascript & HTML' 카테고리의 다른 글

JSMpeg timestamp  (0) 2018.09.11
html5 video timestamp  (0) 2018.09.11
jquey ajax 테스트  (4) 2018.09.03
jquery 복수 속성 선택하기  (0) 2018.08.30
jqeury 예제 그리고 자바스크립트 익명함수  (0) 2017.06.10
Posted by 구차니
파일방2018. 9. 4. 17:14

차트 관련 자바스크립트

조만간 자바스크립트 만세 부를듯.. -0-


그래프 그려주는 자바스크립트 모음인데

chartjs는 2d 느낌인데 원하는건 pie 차트였으나.. 하나밖에 예시가 안보이고..

fusioncharts는 3d 느낌이라 좋아 보이는데 자세히 본게 아니라 어떨지 모르겠네?



[링크 : https://www.chartjs.org/]

[링크 : https://www.fusioncharts.com/]



+

script 넣는 위치로 고민하다가 해결(?) 다음글로 확인 ㅋㅋ

아무튼 type을 변경하면 원하는 그래프가 나오는데...

canvas 요즘 지원안하는 브라우저 없겠지? ㄷㄷㄷ


클라이언트 : IE6 지원하죠?

개발자 : 으아아아아아아

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<style>

</style>

<script src="/js/Chart.min.js"></script>

</head>

<body>

<div id="test" style="width:400px;">

<canvas id="myChart"></canvas>

</div>

<script>

var ctx = document.getElementById('myChart').getContext('2d');

var chart = new Chart(ctx, {

// The type of chart we want to create

type: 'line',


// The data for our dataset

data: {

labels: ["January", "February", "March", "April", "May", "June", "July"],

datasets: [{

label: "My First dataset",

backgroundColor: 'rgb(255, 99, 132)',

borderColor: 'rgb(255, 99, 132)',

data: [0, 10, 5, 2, 20, 30, 45],

}]

},


// Configuration options go here

options: {}

});

</script>

</body>

</html> 


저작자표시

'파일방' 카테고리의 다른 글

cairo  (0) 2018.12.20
swagger.io  (0) 2018.09.07
웹에서 회면 캡쳐하기  (2) 2018.09.03
무료 오프라인 지도  (4) 2018.08.31
mobaXterm  (2) 2018.08.14
Posted by 구차니
Programming/node.js2018. 9. 4. 11:27

node.js + AJAX 테스트

해보니 1초 정도 늦게 나오는거 봐서는 cpu사용율 샘플링 시간을 1초 정도로 잡고 있는 것으로 보인다.


var os = require('os-utils');


os.cpuUsage(function(v){

    console.log( 'CPU Usage (%): ' + v );

}); 


[링크 : https://github.com/oscmejia/os-utils]

[링크 : https://stackoverflow.com/questions/36816181/get-view-memory-cpu-usage-via-nodejs]



<script type="text/javascript">

$(document).ready(function()

{

var sys = {};

$.ajax(

{

url:'http://localhost:3000/sys',

type:'get',

success:function(data)

{

$('#result').text(data.mem);

}

})

});

</script>

<div id="result">blah blah</div>



머. 이로서(?) ajax + node.js 까지 끝(?!)


[링크 : https://opentutorials.org/course/1375/6851]

저작자표시

'Programming > node.js' 카테고리의 다른 글

npm package.json  (0) 2018.09.05
nodaemon  (0) 2018.09.04
node.js CORS  (0) 2018.09.04
node.js와 웹소켓  (0) 2018.09.03
node.js 와 v8  (0) 2018.08.29
Posted by 구차니
Programming/node.js2018. 9. 4. 11:21

node.js CORS

Cross Origin Resource Sharing

다른 도메인의 자원을 공유하는 것으로


RESTful API의 사용으로 웹서버와 REST 서버가 분리됨으로 인해

웹 브라우저에서 크로스 사이트에 대한 보안 정책에 위배되어 접근이 불가능한 것을 우회해주는 설정

(생각해보면 iframe에서 다른 도메인꺼 넣으면 안되던것의 연장선?)


node.js에서 헤더 설정

[링크 : http://guswnsxodlf.github.io/enable-CORS-on-express]


CORS 크롬 플러그인

[링크 : https://chrome.google.com/webstore/detail/allow-control-allow-origi/n.../related?hl=ko]

저작자표시

'Programming > node.js' 카테고리의 다른 글

nodaemon  (0) 2018.09.04
node.js + AJAX 테스트  (0) 2018.09.04
node.js와 웹소켓  (0) 2018.09.03
node.js 와 v8  (0) 2018.08.29
node.js odroid  (0) 2018.08.29
Posted by 구차니
Microsoft/vscode2018. 9. 4. 10:26

vscode shell 변경하기

ctrl-` 을 누르면 콘솔이 뜨고

ctrl-, 로 환경설정을 열어 powershell로 검색을 하면 (설치시에 이걸로 했으니.. ) 이렇게 나오고 이걸

  // Windows에서 터미널이 사용하는 셸의 경로입니다. [셸 구성에 대한 자세한 정보](https://code.visualstudio.com/docs/editor/integrated-terminal#_configuration).

  "terminal.integrated.shell.windows": "C:\\WINDOWS\\System32\\WindowsPowerShell\\v1.0\\powershell.exe"


옆에 연필을 클릭해서 "설정에서 바꾸기" 하면


사용자 설정으로 복사되는데

이 양식대로 수정해주면된다.

{

    "terminal.integrated.shell.windows": "C:\\Windows\\System32\\cmd.exe"

}


[링크 : https://code.visualstudio.com/docs/editor/integrated-terminal]

저작자표시

'Microsoft > vscode' 카테고리의 다른 글

ubuntu에 vscode 설치하기  (0) 2019.05.04
vscode live share?  (0) 2019.01.03
vscode plugin - ssh fs  (0) 2018.11.27
vscode 이전/다음 단축키  (0) 2018.11.13
vscode php  (2) 2018.07.24
Posted by 구차니
Programming/node.js2018. 9. 3. 17:29

node.js와 웹소켓

polling 보다는 interrupt가 낫듯(?)

ajax 단기간 빠른 polling 대신 웹소켓 검색



[링크 : https://poiemaweb.com/nodejs-socketio] node.js + socket.io

[링크 : https://www.a-mean-blog.com/ko/blog/단편강좌/_/Node-JS-Socket-io-채팅사이트-만들기]


[링크 : http://html5korea.com/웹소켓websocket-시작하기강의번역/] php 기반

저작자표시

'Programming > node.js' 카테고리의 다른 글

node.js + AJAX 테스트  (0) 2018.09.04
node.js CORS  (0) 2018.09.04
node.js 와 v8  (0) 2018.08.29
node.js odroid  (0) 2018.08.29
node.js refresh  (0) 2018.08.17
Posted by 구차니
파일방2018. 9. 3. 17:19

웹에서 회면 캡쳐하기

이미지 선택해서 특정 영역 잘라내거나 파일로 저장하는 라이브러리


[링크 : https://html2canvas.hertzen.com/]

[링크 : https://fengyuanchen.github.io/cropperjs/]

저작자표시

'파일방' 카테고리의 다른 글

swagger.io  (0) 2018.09.07
차트 관련 자바스크립트  (3) 2018.09.04
무료 오프라인 지도  (4) 2018.08.31
mobaXterm  (2) 2018.08.14
UI 컨셉툴 - 발사믹  (2) 2018.08.07
Posted by 구차니
Programming/javascript & HTML2018. 9. 3. 15:53

jquey ajax 테스트

가장 만만한 예제로 하는 중

일단.. jqeury를 통해서 load하는거나 다름없긴 하지만

ajax를 통해서 페이지를 불러오는 식으로 일단은 구현



<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<link rel="stylesheet" href="css/style.css">

<script src="js/jquery-3.2.1.min.js"></script>

</head>

<body>

<div id="whole">

<div class="top" id="header"></div>

<div class="content center" id="content"></div>

</div>


<script type="text/javascript">

$(document).ready(function()

{

$.ajax(

{

url:'./pagelet/login.html',

success:function(data)

{

$('#result').append(data);

}

})

});

</script>

<div id="result">blah blah</div>

</body>

</html> 


[링크 : https://opentutorials.org/course/1375/6851]



append로 해도 내용이 없으면 티가 안나는데

내용이 하나라도 있으면 append 답게, 그 이후에 내용이 추가된다.

empty()하거나 html()로 그냥 갈아 치워버리는 것도 방법이 될 듯.


[링크 : https://stackoverflow.com/questions/1675215/ajax-replace-instead-of-append]



위의 예제에서 json까진 해야지 ajax 쓸만해질 듯..


+

ajax 함수에서 사용되는 변수(?)들 이름

type이나 url 이런게 일종의 식별자니까.. 알아두면 작업이 용이할 듯

[링크 : https://www.w3schools.com/jquery/ajax_ajax.asp]

저작자표시

'Programming > javascript & HTML' 카테고리의 다른 글

html5 video timestamp  (0) 2018.09.11
html내 <script>의 올바른 위치(?)  (0) 2018.09.04
jquery 복수 속성 선택하기  (0) 2018.08.30
jqeury 예제 그리고 자바스크립트 익명함수  (0) 2017.06.10
javascript toString() 진법변환  (0) 2017.05.25
Posted by 구차니
개소리 왈왈/컴퓨터2018. 9. 3. 11:20

월이 지났으니 지르자!

일단 1차!

NAS용 하드!


Blue 사려다가 현금 최저가 11.8만

카드가 13만이라 별반 차이 없어 보여서 NAS용 Red로 고고!



저작자표시

'개소리 왈왈 > 컴퓨터' 카테고리의 다른 글

서피스 프로 3 + 서피스 펜 한달 사용 후기  (2) 2018.09.07
NAS 하드 교체.. ㅠㅠ  (2) 2018.09.04
으으으.. 불안하다 ㅠㅠ  (2) 2018.08.29
서피스 프로 3 펜 AAAA 배터리 획득(?!)  (4) 2018.08.23
Atom X5에 원노트는 무리인가..  (2) 2018.08.19
Posted by 구차니
게임/닌텐도 스위치2018. 9. 2. 18:11

닌텐도 스위치에 대한 단상(?)

결론 : 접대용으로 좋네



간만에 아내 친구분 놀러오셔서

아들딸 하나씩 있는데 얘들을 어떻게 묶어두나 걱정했는데

지인에게 빌린 닌텐도 스위치 - 마리오 카트로 커버 ㅋㅋ


일단은 아내는 행동으로 하는 게임을 원하지만

마리오 테니스는 데모버전이 없고.. ARMS 정도라도 일단 받아서 해볼까 고민중


각설하고

xbox 보다는 마리오 카트에 빠져서 게임기를 살 가능성이 생긴 상황..

저작자표시

'게임 > 닌텐도 스위치' 카테고리의 다른 글

닌텐도 스위치 보호필름 교체 그리고 조이콘 조이스틱 수리  (0) 2020.12.12
스위치 방탄유리 + 조이스틱 부품 도착  (0) 2020.12.11
스위치 게임 구매  (2) 2020.11.22
닌텐도 스위치 마리오 카트 디럭스!  (2) 2018.08.24
닌텐도 스위치 2인용 하기  (0) 2018.08.23
Posted by 구차니

티스토리툴바