'파일방' 카테고리의 다른 글
pydio 대체할 녀석들.. (0) | 2019.02.25 |
---|---|
iptable rest api (0) | 2019.02.01 |
vworld (0) | 2019.01.13 |
cairo (0) | 2018.12.20 |
swagger.io (0) | 2018.09.07 |
pydio 대체할 녀석들.. (0) | 2019.02.25 |
---|---|
iptable rest api (0) | 2019.02.01 |
vworld (0) | 2019.01.13 |
cairo (0) | 2018.12.20 |
swagger.io (0) | 2018.09.07 |
브랜치 다시 도전.. ㅠㅠ
저번에 쓴건 먼가 운영을 잘못한 느낌이네..
[링크 : https://www.zerocho.com/category/Git/post/582342a73fbde700178771f5]
[링크 : https://www.zerocho.com/category/Git/post/582df1c8d349570018107477]
gitignore 특정 파일은 예외에서 제외시키기 (0) | 2019.04.17 |
---|---|
gitlab 서비스 명(centos) (0) | 2019.02.15 |
git 윈도우 자격증명 관리 (0) | 2019.01.16 |
git tag (0) | 2018.12.07 |
git log . - 현재 디렉토리 이하의 변경내역 보기 (0) | 2018.11.02 |
react 에서만 쓰는건 아니겠지만(ECMA 표준일테니)
jsx 라는 녀석.. pug때 처럼 html에서 jsx로 변환해서 쓰는게 편할거 같은데.
문제는.. 이런식으로 구성하게 되면
코드랑 디자인이랑 또 섞이게 되는거 아닌가?...
react.js context, component thru (0) | 2019.02.01 |
---|---|
react import {} (0) | 2019.01.31 |
webpack react (0) | 2019.01.28 |
react.js tutorial (0) | 2019.01.28 |
react.js + spring (2) | 2019.01.28 |
node.js에서 이런저런 패키지 깔고 보면
node_modules/패키지 안에 각종 js 파일들이 존재한다.
그걸 끌어올 방법이 없나 하고 찾아보는데
대개는 static으로 해당 모듈의 경로를 지정하고 script 태그에서 끌어다 쓰라는데 영 깔끔한 방법은 아닌 듯..
[링크 : https://julie.io/writing/javascript-node-modules/]
[링크 : https://stackoverflow.com/.../how-to-include-scripts-located-inside-the-node-modules-folder]
[링크 : https://dontkry.com/posts/code/using-npm-on-the-client-side.html]
[링크 : https://forum.vuejs.org/t/include-css-js-assets-from-node-modules-in-index-html/3956/2]
[링크 : https://www.npmjs.com/package/jquery]
+
react.js 예제를 보다 개발자 도구로 보니 은근 node_modules가 보이는걸 발견..
딱히 잘못된 접근은 또 아닌건가?
express ejs (0) | 2019.02.20 |
---|---|
pug include / ejs include (0) | 2019.02.20 |
npm npx yarn bower (0) | 2019.01.28 |
node-red rpi 접속 (0) | 2018.12.20 |
node-red 자동시작 관련 (0) | 2018.12.14 |
libvirt에서 생성하는 녀석으로 보이는데 찾아봐야겠네..
[링크 : https://askubuntu.com/questions/246343/what-is-the-virbr0-interface-used-for]
[링크 : https://firstboos.tistory.com/entry/virbr0-인테페이스-비활성화-on-CentOS]
kvm qemu qcow2 vs raw with windows guest (0) | 2019.02.01 |
---|---|
kvm 디스크 용량 늘리기 + 줄이기 (0) | 2019.02.01 |
virt-viewer for windows (0) | 2019.01.28 |
virt-manager 백업 및 복구 (0) | 2019.01.28 |
virt-manager (0) | 2019.01.28 |
에어코리아에서 제공하는 데이터를 지도에 매핑해서
반경 몇킬로 이내의 측정소 값은 얼마다 이런걸 보여주는 사이트
[링크 : https://dustfeel.com/]
측정소 위치로 보여줘서 좀 좋은것 같기도 하고..
[링크 : https://dustfeel.com/map]
+
회사랑 우리 집이랑 미세먼지가 이상하게 차이나서
측정소로 보고 싶은 욕심이 나, 발견한 사이트
react.js 기본 예제 프로젝트 보다가 보니
App-logo-spin 이라는게 있어서 추적하다보니 나와서 보는 중
[링크 : https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp]
암튼.. @keyframe은 css 문법이었네? @로 시작하는게 머가 있나 봐야겠다
keyframe을 제외하면 아래정도인가?
[링크 : https://www.w3schools.com/cssref/pr_charset_rule.asp]
[링크 : https://www.w3schools.com/cssref/css3_pr_font-face_rule.asp]
[링크 : https://www.w3schools.com/cssref/pr_import_rule.asp]
[링크 : https://www.w3schools.com/cssref/css3_pr_mediaquery.asp]
css 반응형 웹 대응 - 미디어 쿼리 (0) | 2024.01.18 |
---|---|
css3 calc() (0) | 2020.01.03 |
css transform zindex origin (0) | 2018.10.25 |
css tooltip 위치 (0) | 2018.10.25 |
css로 백그라운드만 돌리기 (0) | 2018.10.10 |
import 라고 쓸수 있는게 webpack 덕분이라고 해서 찾아보는 중...
require.js 이런거랑 유사한건가?
[링크 : https://webpack.js.org/]
[링크 : https://velopert.com/3626]
+
별별 유사한 모듈들이 많나보네..
[링크 : https://www.reddit.com/r/javascript/comments/3azxtj/requirejs_vs_browserify_vs_webpack/]
[링크 : https://www.slant.co/versus/3455/11602/~requirejs_vs_webpack]
react import {} (0) | 2019.01.31 |
---|---|
react html to jsx (0) | 2019.01.29 |
react.js tutorial (0) | 2019.01.28 |
react.js + spring (2) | 2019.01.28 |
react.js (2) | 2019.01.10 |
yarn이던 bower 이던 결국에는 node.js 용 패키지 매니저라고 보면 될 듯
[링크 : https://yarnpkg.com/en/]
[링크 : https://bower.io/]
[링크 : https://www.npmjs.com/]
[링크 : https://www.npmjs.com/package/npx]
[링크 : https://www.npmjs.com/package/yarn]
[링크 : https://www.npmjs.com/package/bower]
구버전에서는 yarn이 빠르게 어쩌네 하는데 좀 느리면 어때 ㅋㅋㅋ
[링크 : https://www.keycdn.com/blog/npm-vs-yarn]
[링크 : https://stackoverflow.com/questions/50605219/difference-between-npx-and-npm]
pug include / ejs include (0) | 2019.02.20 |
---|---|
node_modules include (0) | 2019.01.29 |
node-red rpi 접속 (0) | 2018.12.20 |
node-red 자동시작 관련 (0) | 2018.12.14 |
node.js express static (0) | 2018.12.11 |
[링크 : https://reactjs.org/tutorial/tutorial.html#setup-for-the-tutorial]
[링크 : https://reactjs.org/docs/create-a-new-react-app.html#create-react-app]
[링크 : https://github.com/facebook/create-react-app#create-react-app-]
[링크 : https://github.com/facebook/create-react-app/.../README.md#table-of-contents]
node.js가 깔려있어서 그냥 npx 쳐보니 npx를 설치한다고 시간을 좀 잡아먹고 무언가 뜬다
C:\Users\User>npx npx: installed 1 in 5.81s Path must be a string. Received undefined ERROR: You must supply a command. Execute binaries from npm packages. npx [options] <command>[@version] [command-arg]... npx [options] [-p|--package <package>]... <command> [command-arg]... npx [options] -c '<command-string>' npx --shell-auto-fallback [shell] Options: --package, -p Package to be installed. [string] --cache Location of the npm cache. [string] --no-install Skip installation if a package is missing. [boolean] --userconfig Path to user npmrc. [string] --call, -c Execute string as if inside `npm run-script`. [string] --shell, -s Shell to execute the command with, if any. [string] [default: false] --shell-auto-fallback Generate shell code to use npx as the "command not found" fallback. [string] [choices: "", "bash", "fish", "zsh"] --ignore-existing Ignores existing binaries in $PATH, or in the local project. This forces npx to do a temporary install and use the latest version. [boolean] --quiet, -q Suppress output from npx itself. Subcommands will not be affected. [boolean] --npm npm binary to use for internal operations. [string] [default: "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js"] --node-arg, -n Extra node argument when calling a node binary.[string] --version, -v Show version number [boolean] --help, -h Show help [boolean] For the full documentation, see the manual page for npx(1). |
실수로 오타를 냈는데 myapp 이라는 폴더에 기본 템플릿을 생성하도록 명령어를 실행
그나저나 패키지 받는데 무진장 오래걸리네..
그리고 react 관련해서 명령어들이 꽤나 여러가지 출력된다.
C:\Users\User\Desktop>npx create-react-app myap npx: installed 1 in 2.423s Path must be a string. Received undefined npx: installed 63 in 11.172s C:\Users\User\AppData\Roaming\npm-cache\_npx\10196\node_modules\create-react-app\index.js Creating a new React app in C:\Users\User\Desktop\myap. Installing packages. This might take a couple of minutes. Installing react, react-dom, and react-scripts... + react-dom@16.7.0 + react@16.7.0 + react-scripts@2.1.3 added 1926 packages in 197.071s Initialized a git repository. Success! Created myap at C:\Users\User\Desktop\myap Inside that directory, you can run several commands: npm start Starts the development server. npm run build Bundles the app into static files for production. npm test Starts the test runner. npm run eject Removes this tool and copies build dependencies, configuration files and scripts into the app directory. If you do this, you can’t go back! We suggest that you begin by typing: cd myap npm start Happy hacking!
|
[링크 : https://reactjs.org/docs/hello-world.html]
+
2019.01.29
node.js 보다 확실히 구동이 좀 오래걸리네..
그리고 자동으로 등록된 브라우저를 실행해서 띄우는데 이거 끄는 법 없나?
(IE edge를 기본으로 하고 크롬써서..)
D:\work\src\myapp>npm start > myapp@0.1.0 start D:\work\src\myapp > react-scripts start Starting the development server... Compiled successfully! You can now view myapp in the browser. Local: http://localhost:3000/ On Your Network: http://10.0.0.4:3000/ Note that the development build is not optimized. To create a production build, use npm run build. |
npm run build로 빌드!
D:\work\src\myapp>npm run build > myapp@0.1.0 build D:\work\src\myapp > react-scripts build Creating an optimized production build... Compiled successfully. File sizes after gzip: 34.71 KB build\static\js\1.fa92c112.chunk.js 763 B build\static\js\runtime~main.229c360f.js 716 B build\static\js\main.690c38a1.chunk.js 512 B build\static\css\main.659f8df7.chunk.css The project was built assuming it is hosted at the server root. You can control this with the homepage field in your package.json. For example, add this to build it for GitHub Pages: "homepage" : "http://myname.github.io/myapp", The build folder is ready to be deployed. You may serve it with a static server: npm install -g serve serve -s build Find out more about deployment here: http://bit.ly/CRA-deploy |
npm start로는 개발버전으로 실행되고
serve를 통해서 build 디렉토리 내의 것을 실행해야 static하게 구동이 되는 듯?
그리고 포트가 3000 번에서 5000 번으로 바뀐다.
D:\work\src\myapp>npm install -g serve C:\Users\user\AppData\Roaming\npm\serve -> C:\Users\user\AppData\Roaming\npm\node_modules\serve\bin\serve.js + serve@10.1.1 added 78 packages in 3.909s D:\work\src\myapp>serve -s build ┌───────────────────────────────────────────────┐ │ │ │ Serving! │ │ │ │ - Local: http://localhost:5000 │ │ - On Your Network: http://10.0.0.4:5000 │ │ │ │ Copied local address to clipboard! │ │ │ └───────────────────────────────────────────────┘ |
+
윈도우에서는 아래와 같이 set을 통해서 한번 해주면 해당 콘솔창에서는 계속 적용 된다.
D:\work\src\myapp> set BROWSER=none D:\work\src\myapp> npm start |
[링크 : https://github.com/facebook/create-react-app/issues/2084]
[링크 : https://stackoverflow.com/questions/51706882/how-do-i-npm-start-with-a-specific-browser]
[링크 : https://github.com/kitze/custom-react-scripts/tree/master/packages/react-scripts#others]
[링크 : https://github.com/facebook/create-react-app/issues/873]
react import {} (0) | 2019.01.31 |
---|---|
react html to jsx (0) | 2019.01.29 |
webpack react (0) | 2019.01.28 |
react.js + spring (2) | 2019.01.28 |
react.js (2) | 2019.01.10 |