전체 글 77

PyCharm 에서 Github 사용 Using Github with PyCharm

GitHub: Where the world builds software GitHub is where over 50 million developers shape the future of software, together. Contribute to the open source community, manage your Git repositories, review code like a pro, track bugs and feat... github.com 깃허브 홈페이지 입니다. 회원가입을 해줍니다. This is the website of GitHub, sign up as a member. desktop.github.com/ GitHub Desktop Simple collaboration from your de..

Setting/Python 2020.11.24

파이참 폰트, 테마 변경 PyCharm Setting

별거 없습니다 Theme 는 Darcula 를 사용하였고 폰트는 Hack 을 사용하였습니다. Hack 폰트 링크 Hack | A typeface designed for source code A Family of Four Faces Hack includes monospaced regular, bold, italic, and bold italic sets to cover all of your syntax highlighting needs. sourcefoundry.org Dracula 는 기본 사용 Darcula Darker Theme - Plugins | JetBrains A dark theme based on Darcula, but with more contrasting tones. For JetBrai..

Setting/Python 2020.11.23

PyCharm 에서 Python 시작하기 (Getting Started with Python in PyCharm

Jetbrains의 PyCharm 개발 도구를 이용해서 Python을 시작해보려 합니다. 다운로드는 다음의 주소와 같습니다 www.jetbrains.com/ko-kr/products.html#lang=python&lang=r-lang All Developer Tools and Products by JetBrains www.jetbrains.com 아래는 한글 설정 방법 창은 ctrl + alt + S 키로 간단하게 켜주세요 아래는 파이썬을 설치하고 경로 설정까지 import sys print(sys.executable) 인터프린터 설정은 위에서 인터프리터 경로를 찾은것과 같은곳으로 설정해주세요

Setting/Python 2020.11.23

예쁜것들을 쓸 수 있는 크롬웹, 사이트

ColorZilla ColorZilla Advanced Eyedropper, Color Picker, Gradient Generator and other colorful goodies chrome.google.com html 밑 image 색상의 원하는부분을 복사 할 수 있음 Page Ruler Page Ruler Draw a ruler to get pixel dimensions and positioning, and measure elements on any web page. chrome.google.com 여백들의 px 아이콘의 px들 웹페이지의 "자"라고 볼 수 있음 GoogleFont Google Fonts Making the web more beautiful, fast, and open throu..

Setting/Utils 2019.05.08

페이스북인증하기위한 app ID와 app시크릿코드보기

https://developers.facebook.com/ Facebook for Developers Facebook 사용자와 연결할 수 있는 코드 인공 지능, 비즈니스 도구, 게임, 오픈 소스, 게시, 소셜 하드웨어, 소셜 통합, 가상 현실 등 다양한 주제를 둘러보세요. Facebook의 글로벌 개발자 교육 및 연결 프로그램에 대해 알아보세요. developers.facebook.com 에서 app을 새로만들자 설정화면에서 누르자 그런다음 http는 보안규격상 안된다는 이유로 메시지가뜨는데 이러한메시지 npm i -g ngrok 이후 pakage.json에서 "ngrok": "ngrok http 4000" 작성 이후 npm run ngrok 으로실행하여 로 http->htpps인 url을얻어봅니다.

Github 인증을만들기위해 Github application 을 생성해보자

깃허브 애플리케이션 생성 작동원리: 사용자 정보 깃헙 페이지로 보냄 특별한URL로 => 깃헙(Application)에게 너의 정보를 줘도 되? ask => 사용자:OK 받으면=> 사용자를 다시 나의 application으로 돌려보내는데 사용자의 깃허브 정보도 같이 줌 Client ID와 Client Secret 가 보이며 절대로 공유를하지않습니다. http://www.passportjs.org/packages/passport-github 에서보면 아래에 해당되게 쓸수있다 passport-github GitHub authentication strategy for Passport. www.passportjs.org

Develop Dairy 2019.04.03

인증기능 사용하기 PassportJS 모듈

인증의 매커니즘은 브라우저 상에 쿠키(Cookies)를 설정해주면 그 쿠키를 통해 사용자 ID (아이디) 등을 알 수 있고 Passport가 브라우저에서 자동으로 쿠키를 가져와서 (인증이 완료된) User object를 controller에 넘겨주는것 대부분의 서비스에서 인증받을수 있다. 페이스북, 깃헙, 구글, 스팀, 카카오, 인스타그램 등등 거의모든것. 아래와같이 사용하다. 인증받을수있는 서비스들 목록 사이트에들어가보면 Start typing으로들어가보자 쿠키는 웹브라우저에서 f12를 누른뒤 아래와 같이 확인가능하다. 쿠키에는 모든 request에 대해서, back-end로 전송될 정보들이 담겨있다 서버가 로그인이나 가입 홈으로 가기등등 요청할때 브라우저가 자동적으로 쿠키들을 서버로 전송해준다. 여기..

webpack 세팅 on Visual Studio Code

webpack은 module bundler 이다 즉우리가 많은 파일들을 가져와서 webpack으로 주면 webpack은 완전히 호환되는 static 파일들로 변환해서 주는 것 ex) ES6와 바닐라 자바스크립트를 쓰고있고 또 Sass, 최신JS 것들을 webpack을 통하면일반적인 CSS와 오래된 자바스크립트로 변환해서 브라우저가 알아들을 수 있도록 해주는 것이다. 설치는 다음과같다. $ yarn add webpack webpack-cli$ yarn add extract-text-webpack-plugin@next$ yarn add css-loader postcss-loader sass-loader autoprefixer node-sass webpack은 파일에서 webpack을 사용하기 위함이고, we..

ESLint 무언가 틀린게있으면 가르쳐주는 친구

ESLint를 비쥬얼스튜디오에서 설치해보자 1. 만약에 npm으로 eslint 를 글로벌로 설치했었다면 지워보자 $ npm uninstall eslint -g 2. vscode에서 ESlint extension를 설치하자 3. 수동의 3개의 패키지를 설치한다.(eslint-config-airbnb-base, eslint, eslint-plugin-import) 3개의 패키지$ npm add eslint-config-airbnb-base eslint eslint-plugin-import 4. .eslintrc.js 파일을 만들고 다음과 같이 복사한다 module.exports = { env: { browser: true, es6: true, node: true }, extends: "airbnb-base"..