전체 글 (36) 썸네일형 리스트형 라즈베리파이 - 계정 생성, 권한 설정, 외부 연결 정보 공유보단 개인학습 & 내용 정리 목적으로 블로깅한거라 의식의 흐름대로 썼기 때문에 정확하지 않을수도 있다 ^^;; (+같은 삽질을 하는 사람이 더 없길 바라며) 일단 서버란 하나의 제공자(컴퓨터)이다. 그리고 작업의 목적은 라즈베리 파이를 서버로 두고 클라이언트 컴퓨터에서 데이터를 조회할 수 있도록 만드는 것이다. 일단 매번 라즈베리 파이에 모니터, 키보드, 마우스를 연결할 수는 없으니 ssh를 이용해 클라이언트 컴퓨터에서 서버컴퓨터를 조작할 수 있도록 한다. (putty라는 프로그램을 사용했다. 구글링하면 사용법이 잘 나온다.) ssh : 원격 호스트 컴퓨터로 접속하기 위해 정의된 인터넷 프로토콜 이 과정에서 한 첫번째 삽질.. 자꾸 접속이 안되는 문제가 발생.. ip가 틀렸다는 간단한 이유였는데.. 라즈베리파이 - DB 설치 및 접속 라즈베리파이에서 DB 설치하는법 (mariadb) 1. 패키지 설치 전 기존의 패키지를 업데이트 해주어야 한다. $sudo apt-get update $sudo apt-get upgrade 2. mariabd를 설치한다 $sudo apt-get install mariadb-server 3. mariadb 버전을 확인해봄으로써 제대로 설치되었는지 체크한다 $mysql -V 4. mysql -u root -p로 로그인을 해준다. 패키지 업데이트가 아주 느린속도로 진행되긴했지만, 나름대로 잘 따라갔다고 생각했는데 $mysql -u root -p/ $sudo mysql -u root -p 둘 다 아래의 에러메시지가 뜨면서 접속이 되지 않았다. ERROR 1045 (28000): Access denied for .. FIREBASE를 이용하여 로그인 구현하기 리액트에 firebase를 연결해서 로그인을 구현해보았다. 메인 컨셉은 firebase에서 제공하는 sdk를 나의 프로젝트와 연결한 후 함수를 이용하여 구현하는 것 차근차근 구현을 해보았다. 미리 해놓아야하는것 : - firebase홈페이지에 들어가서 프로젝트 추가 후 Authentication, Realtime Database 시작해놓기 - console창의 Authentication의 Sign-in method에서 사용을 원하는 로그인방시의 실행을 on으로 변경해놓기 - 프로젝트에 firebase를 add하기 1. firebase sdk를 내 앱에 복사-붙여넣기한다. - 보통 service폴더를 하나 만든 후 firebase.js라는 js폴더를 따로 빼서 관리하면 편리하다. - firebase 사이트.. Object(객체) 1.객채의 정의 primitive type 자바스크립트 자료형의 기본 타입으로 변경 불가능 한 값이다. 변수 하나당 하나의 값을 원칙으로 한다. const name = 'yurim'; const gender = 'female'; const age = 29; yurim이라는 사람에 대한 정보를 각각의 변수에 담아서 console창에 출력하는 함수를 만들고자 한다면 아래와 같이 각각의 변수들을 다 입력해주어야 할 것이다. const print = (name,gender,age) => { console.log(name, gender, age); } print(name, gender, age); 이러한 방법은 인자의 값이 적을때면 큰 문제가 없지만 인자의 값이 많아질 경우 파라미터가 너무 많이 생기고, 결국 관.. 로컬스토리지/세션스토리지/쿠키 로컬 스토리지와 세션 스토리지는 HTML5에서 추가된 저장소이다. 이 두 저장소의 차이점은 영구성에 있다. 로컬스토리지는 사용자가 지우지 않는 이상 계속 브라우저에 남아있지만, 세션 스토리지는 윈도우나 브라우저 탭을 닫을 경우에 제거된다. 그리고 이 저장소들이 나오기 이전에는 쿠키가 브라우저의 저장소 역할을 했다. 쿠키는 만료 기간이 있는 키-값 저장소인데, 대부분의 브라우저가 지원한다는 장점이 있다. 쿠키는 4kb의 용량 제한이 있고, 매 서버 요청마다 서버로 쿠키가 같이 전송된다. HTTP요청은 상태를 가지고 있기 때문에 쿠키가 나에 대한 정보를 담아서 서버에게 나에대한 정보를 담아서 전송한다. 즉, 쿠키는 서버-클라이언트간의 지속적인 데이터 교환을 위해 만들어졌다. 하지만 이 쿠키방식에는 단점이 있.. express : middleware 미들웨어의 사전적 정의는 컴퓨터 제작 회사가 사용자의 요구대로 만들어 제공하는 프로그램으로, 운영 체제와 응용 소프트웨어의 중간에서 조정과 중개의 역할을 수행하는 소프트웨어이다. 사전적 정의보다는 미들웨어를 사용하는 상황을 확인하여 이에 대한 개념을 잡아보도록 하겠다. 간단하게 사용자가 사이트에게 접속했을 때, 로그인이 되어있으면 로그아웃 버튼을, 로그인이 되어있지 않으면 로그인/회원가입 버튼을 띄워보고 싶으면 모든 require명령어 옆에 if문을 사용하여 명령을 입력해야 할 것이다. 모든 개발과정이 그렇든 1~2개일때는 문제가 없지만 그 수가 많아진다면, 또 오타나 수정사항이 발생한다면 관리하기가 힘들어 질 것이다. 이때 우리는 로그인 관련 메서드를 미들웨어로 만들어서 관리 할 수 있다. (페이지의 .. 국비과정 (UI/UX디자인 웹퍼블리셔 & 프론트엔드 개발자 양성과정) 수료 후기 수업을 듣게 된 계기 나는 2014년부터 5년을 넘게 여행사에서 근무한 여행 오퍼레이터였고, 코로나19가 시작되면서 언제 끝날지 모르는 휴직상태에 들어가게 되었다. 시국이 언제 끝날지 알 수 없기 때문에 쉬는동안 무엇인가 배워보고자 했는데 처음엔 그 과정이 디자인&퍼블리셔 반이었다. 하지만 웹개발을 공부하는 동생(백엔드)과 대화를 나누어보고, IT산업에 대해 관심을 가지다보니 이 분야가 굉장히 매력적으로 다가왔고, 비슷한 분야를 공부하면서 같이 발전해나간다면.. 나중에 함께 협업도 가능해진다면 좋지 않을까? 라는 생각이 들었고 그래서 프론트엔드 개발을 배우기로 마음을 먹었다. 당시 디자인&퍼블리싱&프론트엔드&백엔드의 개념도 잘 안잡혀 있는 상태였지만 뭐든 하나만 알기보다는 동종업계의 배경지식을 갖추고 있.. express : router router란 express의 내장기능인다 지난 포스팅에서 express를 이용해서 주소창 파라미터터에 따라 페이지를 다르게 띄워주는 코드를 작성해보았다 (아래 코드 참조) const express = require('express'); const app = express(); const port = 3000; app.get('/', (req, res) =>{ res.send('hello express'); }); app.get('/doit', (req, res) =>{ res.send('I can do it, You can do it, We can do it'); }); app.listen( port ); 이 방식은 적은 양의 주소창을 관리하기에는 편리하지만, 페이지가 수십개가 넘어 갈 경우 파일이 지.. 이전 1 2 3 4 5 다음
