gaori

미스틱 언박싱 제품 구성을 보면 왼쪽부터 hdmi 확장선(저는 쓸 일이 없어서 다시 박스에 넣었습니다) usb처럼 작은 본체 본체에 전원을 연결하는 전원선(옛날 안드로이드 5핀) 전원선과 연결하는 부분 (핸드폰 충전기 같은) 그리고 리모컨입니다 미스틱 연결 리모컨에 건전지를 껴줍니다 이제 본체에 전원선(옛날안드로이드5핀)을 껴줍니다 이렇게 연결을 다 해놓습니다 본체를 티비 hdmi에 연결을 하면 하얀불이 들어옵니다 설정 다음은 이제 화면에서 여러가지 설정을 하는데 언어설정은 맨아래로 내려보면 한국어있습니다 다음은 사는곳 설정인데 한국이 없어서 아무거나 선택하면 됩니다 안드로이드 폰이 있다면 쉽게 와이파이에 연결할수있지만 없다면 직접 연결하면 됩니다 마지막으로 약관동의와 위치전송, 사용내역 전송이 있는데 ..

전에 디자인 했던 NEVER에는 로그인에서 회원가입페이지로 이동하는 작업만이 가능합니다 이제 회원가입기능과 로그인기능을 넣겠습니다 apollo-boost에서 gql을 불러옵니다 gql은 백엔드에서 graphql로 작성한 mutation이나 query 코드를 가져오게 하는 코드입니다 import해서 불러 와도 되지만 vsc는 작성하면서 자동으로 불러와 줍니다 먼저 회원가입 코드를 불러오겠습니다 백엔드에서 만들때 회원가입을 하기위해 이메일,비밀번호,이름을 받아 생성하기 때문에 위에 방식으로 작성합니다 백엔드 코드와 비슷하면서 다릅니다 자세한 내용은 graphql에서 확인하세요 이제 저 코드를 사용하려면 useMutation을 사용합니다 query를 사용하려면 useQuery를 사용해야합니다 useMutati..

진짜 네이버로 들어가서 전체적인 부분을 확인한다 일단은 크게 로그인화면과 회원가입화면을 나눈다 전에 라우트 확인용으로 만들어둔 Auth.js를 삭제하고 Login.js 와 SignUp.js를 만든다 로그인 화면과 회원가입화면을 만들면 된다 화면이 두개로 늘어났으니 Routes.js의 구성도 바꿔줘야한다 LogOut에는 Auth.js 만 있었지만 이제 Login 과 SignUp을 넣어준다 주소는 로그인은 기본주소이고 회원가입의 주소는 signup으로 설정해 준다 다시 진짜네이버로 와서 어떤 componet가 필요한지 확인한다 로그인 화면이나 회원가입화면은 간단하게 title 과 input, button 으로 구성되어있다 만들어야 할 componet를 확인했으니 만들어준다 AuthButton.js 과 Aut..

전에 BackEnd에서 만든 회원가입과 로그인을 React로 가져오기 위해서 몇가지 설정을 해줘야 한다 설정하기 앞서 css를 초기화 하는 작업을 한다 yarn add로 패키지를 받는다 초기화하는 방법에는 많은 방법이 있지만 styled-reset 패키지 방법을 이용하면 쉽고 빠르게 할 수 있다 src에 GlobalStyles.js를 만들어서 styled-components에 createGlobalStyle과 styled-reset의 reset를 가져온다 createGlobalStyle 은 페이지의 전체적인 css를 설정할 수 있다 reset 은 css를 초기화 한다 코드를 보면 createGlobalStyle 안에 reset 을 넣은것을 볼 수있다 body에 배경색을 네이버 로그인 배경색을 넣어준다 위..

회원가입에서 create.graphql파일과 create.js 파일을 만들었다 로그인도 똑같은 형식으로 login.graphql 과 login.js 파일을 만든다 login.graphql은 회원가입과 똑같은 형식으로 한다 create.graphql를 모두 복사해서 몇개만 고쳐도 되지만 직접 써보면서 익숙해지는게 중요하다(직접) login.graphql에는 email과 password만 받는다 (로그인은 다른 사이트에서도 그렇게 하니까) 회원가입의 반환값은 참, 거짓이었지만 login은 jsonwebtoken을 반환해야 하므로 String을 반환값으로 준다 로그인 하기위해서는 모든 사이트에서 그렇듯 email(id) 이랑 password를 받아서 email(id)가 존재하는지 찾고 password가 일치하..

단순하게 로그인 화면만 하려고 했지만 로그인을 하려면 회원가입이 있어야 하니까로그인과 1+1이라고 할 수 있는 회원가입을 먼저 해본다 역시 동일 하게 그린포털사이트를 따라한다 아이디, 비밀번호,이름만 가지고 회원가입을 해본다 그린포탈사이트에는 위에 네가지 말고 핸드폰번호,성별,이메일(선택)이 더 있다 하지만 NEIGHBER는 안한다Backend 테이블 기존 User에는 id 와 name뿐 이지만 email과 password가 필요하니 넣어준다datamodel 의 형식은 prism docs에 나와있다 간단하게 설명하면 String은 문자열이고 !(느낌표)는 "필수" 라는 뜻이다 prisma 의 datamodel 말고도 graphql 모델도 만들어야 한다 그래야 서버에서 알아들으니까api 폴더 안에 mode..

Prisma2가 나와 Prisma의 데모서버는 사용할 수 없게 되었습니다 간단한 로그인화면 그냥 만들면 재미없으니까 그린포털사이트를 따라해본다 일단은 이런느낌으로 가는데 더 간단하게 만들자 이름은 NEIGHBER 기본 개발환경 yarn 아니면 npm 둘중 하나 git에 저장하려면 git 이랑 git 저장소(github,Bitbuckit...) 아이디 vsc(Visual Studio Code) - 코드편집 Frontend Setting 원하는 폴더로 이동후 npx create-react-app 으로 다운받는다 뒤에 이름은 오직 로그인만 구현해 볼것이기 때문에 대충 직독직해로 only-login npx를 안쓰려면 npm이나 yarn 으로 create-react-app을 전역으로 설치해준다 npx를 쓰는 이유..

Repl.it 사용하고 있는 컴퓨터 용량에 부담없이 언어를 사용할 수 있는 사이트라고 하면 될까요? 독학이든 교육을 받는 학생이든 처음 공부하는 분들까지 심지어 현재 개발자분들에게도 유용하게 쓰일 수 있을것 같습니다 The world's leading online coding platform Powerful and simple online compiler, IDE, interpreter, and REPL. Code, compile, and run code in 50+ programming languages: Clojure, Haskell, Kotlin (beta), QBasic, Forth, LOLCODE, BrainF, Emoticon, Bloop, Unlambda, JavaScript, CoffeeS..

맥북뿐만 아니라 다른랩탑, 데스크탑을 이용하다보면 항상 화면을 캡쳐해야 하는 일이 생깁니다 (거의 필수적으로..) 윈도우에서도 화면캡쳐가 있듯이 맥북에서도 화면캡쳐가 있습니다 맥북에서 화면캡쳐 단축키는 총 세가지가 있습니다 1 . command ⌘ + shift ⇧+ 3 (전체화면 캡쳐) 2. command ⌘ + shift ⇧+ 4 (영역지정하여 캡쳐) 3. command ⌘ + shift ⇧+ 5 (여러가지 옵션선택하여 캡쳐,녹화) 그냥 대충찍어 보내기 아주 좋아서 저는 2번째 영역지정해서 캡쳐를 진짜 많이 활용해요 1 . command ⌘ + shift ⇧+ 3 (전체화면 캡쳐) 단축키를 누르면 아래화면처럼 전체화면이 캡쳐되서 바로 왼쪽아래에 뜹니다 모든 캡쳐가 왼쪽아래에 뜨는데 저는 저 캡쳐사진을..

JavaScript Class의 특징들은 다음과 같다 1. 기존 라이브러리에 class를 가져다가 쓰는경우가 대다수 이다 2. class를 사용하면 재사용이 용이하다(선언만 하면 같은걸 여러번 생성이 가능) 3. 클래스는 더 좋은 객체 처럼 생겼다 class 선언 선언은 세가지 방법이 있다 class MySelf { constructor(age, height) { this.age = age; this.height = height; } } 바로 클래스를 선언 const MySelf = class MySelf { constructor(age, height) { this.age = age; this.height = height; } } 변수에 클래스를 선언 const MySelf = class { constr..