전체 글170 Go 언어 Back End 제작해보기(패스워드 해싱) 6장 ◆ 패스워드 해싱 ▶ 해싱을 위한 패키지 설치 go get golang.org/x/crypto/bcrypt ▶ dblayer 디렉토리의 dblayer.go 파일에 추가 var ErrINVALIDPASSWORD = errors.New("Invalid password") ▶ dblayer 디렉토리의 orm.go 파일에 패키지 import import ( "errors" "models" _ "github.com/go-sql-driver/mysql" "github.com/jinzhu/gorm" "golang.org/x/crypto/bcrypt" ) ▶ dblayer 디렉토리의 orm.go 파일에 함수 추가 func hashPassword(s *string) error { if s == nil { return e.. 2023. 5. 26. Go 언어 Back End 제작해보기(데이터베이스) 5장 ◆ MySQL에 테이블 생성 create database GoMusic; use GoMusic; create table customer( id int PRIMARY KEY AUTO_INCREMENT, firstname varchar(50) not null, lastnamename varchar(50) not null, email varchar(100) unique not null, cc_customerid varchar(50) not null, looggedin tinyint not null, created_at timestamp DEFAULT CURRENT_TIMESTAMP, updated_at timestamp DEFAULT CURRENT_TIMESTAMP, deleted_ar timestamp );.. 2023. 5. 25. Go 언어 Back End 제작해보기(보안) 4장 ◆ HTTPS ▶ HTTTP 와 TLS(Transpoer Layer Security)의 조합 – 과거에는 SSL을 이용하기도 함 ▶ 원리 ● 웹 클라이언트와 웹 서버가 서로 신뢰할 수 있는지 확인하는데 신뢰는 핸드셰이크(handshake), 인증서, 개인 키를 바탕으로 함 ● 웹 클라이언트와 웹 서버는 암호화 키 사용을 동의 ● 합의한 키를 사용해 클라이언트와 서버는 통신 내용을 암호화 ▶ 클라이언트 와 서버의 신뢰성 확인 ● 인증서와 키는 완전히 다른 개념 ● 개념을 이해하개인려면 공개 키 암호화(public key encryption) 나 비대칭 암호화(asymmetric cryptography)를 이해할 필요가 있음 ● 공개 키(public key)는 데이터를 암호화할 때 사용되며 공유해도 되지만 .. 2023. 5. 24. Go 언어 Back End 제작해보기(미들웨어) 3장 ◆ 웹 API 미들웨어 ▶ 클라이언트의 요청을 처리하기 전 후에 호출되서 작업을 수행하는 코드 ▶ Gin 웹 서버에서는 2개의 미들웨어를 제공: https://github.com/gin-gonic/contrib ● Logger 미들웨어: 로그를 기록하기 위한 미들웨어 ● Recovery 미들웨어: 500번 에러가 발생하면 HTTP 에러 코드로 응답하는 미들웨어 ▶ 커스텀 미들웨어 ●호출될 함수 생성 func MyCustomMiddleware() gin.HandlerFunc { return func(c *gin.Context) { // 요청을 처리하기 전에 실행할 코드 // 예제 변수 설정 c.Set("v", "123") // c.Get(V)를 호출하면 변수 값을 확인할 수 있다. // 요청 처리 로직 실.. 2023. 5. 23. Go 언어 Back End 제작해보기(라우팅 설정) 2장 ◆ Gin 프레임워크 설정 ▶ GOPATH 디렉토리로 프로프트를 이동한 후 Gin 프레임워크 설치 go get -u github.com/gin-gonic/gin ▶ src 디렉토리에 rest 디렉토리를 생성하고 handler.js 파일을 생성하고 작성 package rest import ( "fmt" "log" "net/http" "strconv" "dblayer" "models" "github.com/gin-gonic/gin" ) type Handlerinterface interface { GetProducts(c *gin.Context) GetPromos(c *gin.Context) AddUser(c *gin.Context) Signln(c *gin.Context) SignOut(c *gin.Cont.. 2023. 5. 22. Go 언어 Back End 제작해보기(Restful API,Gin Framework, Model & Database Layer) 1장 ◆ 개요 ▶ 웹 서비스에서 자원을 요청 및 제어할 때 적용되는 일련의 규칙 ▶ 자원은 보통 HTML 문서(웹 페이지)나 JSON 문서(단순 정보 조회) ▶ JSON이란 JavaScript Object Notation의 약자로 자바스크립트의 객체를 표현하는 방식으로 API에서 가장 많이 쓰이는 데이터 형식 ▶ 대부분의 RESTful API는 HTTP를 사용 ◆ Gin Framework ▶ Gin 프레임워크는 고성능 RESTful API 개발에 많이 사용되는 Go 기반의 오픈 소스 프레임워크 ▶ https://github.com/gin-gonic/gin ▶ Gin 프레임워크는 성능도 높고 실제 RESTful API를 구현하는 데 사용할 수 있는 간단하고 사용하기 쉬운 API를 제공 ◆ Model ▶ 데이터 .. 2023. 5. 18. Go 언어 Front End 제작해보기(서비스 등록 페이지, 컴포넌트 등록 ) 6장 ◆ 서비스 등록을 위한 페이지 작성 ▶ src/registerServiceWorker.js 파일을 생성하고 작성 // In production, we register a service worker to serve assets from local cache. // This lets the app load faster on subsequent visits in production, and gives // it offline capabilities. However, it also means that developers (and users) // will only see deployed updates on the "N+1" visit to a page, since previously // cached resou.. 2023. 5. 17. Go 언어 Front End 제작해보기(주문내역 페이지, 탐색메뉴) 5장 ◆ 주문 내역 페이지 ▶주문 내역 페이지 – src/order.js import React from 'react'; function Order(props) { return ( {props.productname} {props.desc} Price: {props.price} Purchased {props.days} days ago ); } export default class OrderContainer extends React.Component { constructor(props) { super(props); this.state = { orders: [] }; } componentDidMount() { fetch(this.props.location) .then(res => res.json()) .then((.. 2023. 5. 15. Go 언어 Front End 제작해보기(로그인 페이지) 4장 ◆ 로그인 페이지 ▶로그인 폼을 작성 – src/modalwindow.js 파일 class SingInForm extends React.Component { constructor(props) { super(props); this.handleChange = this.handleChange.bind(this); this.handleSubmit = this.handleSubmit.bind(this); this.state = { errormessage: '' } } handleChange(event) { const name = event.target.name; const value = event.target.value; this.setState({ [name]: value }); } handleSubmit(ev.. 2023. 5. 12. Go 언어 Front End 제작해보기(회원 가입) 3장 ◆ 회원 가입 페이지 ▶ 회원 가입 폼을 작성 – src/modalwindow.js 파일 class RegistrationForm extends React.Component { constructor(props) { super(props); this.handleSubmit = this.handleSubmit.bind(this); this.state = { errormessage: '' } this.handleChange = this.handleChange.bind(this); this.handleSubmit = this.handleSubmit.bind(this); } handleChange(event) { event.preventDefault(); const name = event.target.name; .. 2023. 5. 11. Go 언어 Front End 제작해보기(모달 윈도) 2장 ◆ 상품 주문 모달 윈도 ◆ 모달을 위한 패키지 설치: npm install -–save reactstrap ◆ 상품 주문 모달 윈도 – modalwindow.js 파일을 src 디렉토리에 생성하고 작성 export function BuyModalWindow(props) { return ( Buy Item ); } ◆ 신용카드 결제 처리 ▶ 신용카드 정보 입력 폼 구현은 간단해 보일 수 있지만 텍스트 입력 창이 전부가 아니며 실제 운영 중인 서비스라면 신용카드 유효성을 검사하고 입력받은 정보를 안전하게 처리해야 하는데 신용카드 정보는 매우 민감한 정보이기 때문에 일반 데이터처럼 취급할 수 없음 ▶ 프론트 엔드에서 사용할 수 있는 다양한 신용카드 결제 서비스가 있는데 그 중 가장 많이 쓰이는 스트라이프 (.. 2023. 5. 10. Go 언어 Front End 제작해보기 1장 ◆ node 설치 ◆ react 설치 : npm install -g create-react-app ◆ 참고할 내용 ▶ 리액트 라우터 패키지: https://reacttraining.com/react-router/ ▶ 스트라이프: https://stripe.com/ ▶ 리액트 폼 제어: https://reactjs.org/docs/forms.html ◆ 프로젝트 생성: create-react-app music_frontend ◆ src 디렉토리에서 다음 파일 삭제 ▶ App.css ▶ index.css ▶ logo.svg ◆ public 디렉토리에 다운로드 받은 파일을 복사 ◆ Main 페이지를 위한 3개의 자바스크립트 파일을 src 디렉토리에 생성 ▶ Navigation.js: 탐색 메뉴 컴포넌트 ▶ P.. 2023. 5. 5. 이전 1 ··· 6 7 8 9 10 11 12 ··· 15 다음
