✍️ 글쓰기/💻 배우고10 SFTP(SSH) 개념 정리 ■ SFTP (Secure File Transfer Protocol)란 SFTP는 웹 상에서 큰 파일들을 전달하는 파일 프로토콜(protocol)이다. File Transfer Protocol(FTP)를 토대로 만들어졌으며 Secure Shell(SSH) 보안 컴포넌트를 가지고 있다. Secure Shell은 인터넷 보안의 암호화된 컴포넌트인데, IETF(Internet Engineering Task Force)가 더 나은 웹 보안을 위해 SSH와 SFTP을 디자인했다. 즉, SFTP는 FTP의 형태를 가지고 있지만 SSH를 이용하여 그 기능을 실행한다. SFTP는 SSH를 사용해 파일을 안전하게 전송하고, 암호화된 FTP 커맨드로 비밀번호나 민감한 정보들을 안전하게 보호한다. 클라이언트가 서버로부터 .. 2022. 7. 14. Amazon Cognito와 Amplify로 리액트 앱에서 Authentication 구현하기 ■ Amazon Cognito란? Amazon Cognito는 웹 및 모바일 앱에 대한 인증, 권한 부여 및 사용자 관리를 제공한다. 사용자는 사용자 이름과 암호를 이용하여 직접 로그인하거나 Facebook, Amazon, Google 또는 Apple 같은 타사를 통해 로그인할 수 있다. 사용자 인증 이후 AWS 서비스에 대한 사용자 액세스 권한을 부여하는 과정이다. 1. 첫 번째 단계에서 앱 사용자는 사용자 풀(User pool)을 통해 로그인하여 인증 성공 이후 사용자 풀 토큰을 부여 받는다. 2. 앱은 자격 증명 풀(Identity Pool)을 통해 사용자 풀 토큰을 AWS 자격 증명으로 교환한다. 3. 앱 사용자는 AWS 자격 증명을 사용하여 Amazon S3, Dynamo DB 등 다른 AWS .. 2022. 5. 14. 3-2. AWS Elastic Beanstalk + AWS S3 + CloudFront 에서 프론트엔드 - 백엔드 라우팅 ■ React + Flask + GraphQL 웹 어플리케이션 프로젝트 전체 로드맵 React & Flask & GraphQL 웹앱 프로젝트 시작 🏁 이번에 리액트와 플라스크를 활용해 프로젝트를 할 기회가 생겼다. 거기에 GraphQL API에서 필요한 데이터들을 CRUD 해야 했는데, 이런 조합의 프로젝트 예시를 찾아보는 것이 쉽지 않았다 🥺 언젠 joy-able.tistory.com * 이 글의 전체 프로세스는 이 링크를 토대로 진행되었습니다. ■ CloudFront CloudFront란? Amazon CloudFront는 .html, .css, .js 및 이미지 파일과 같은 정적 및 동적 웹 콘텐츠를 사용자에게 더 빨리 배포하도록 지원하는 웹 서비스이다. 우리가 앱을 만들면서 CloudFront 를.. 2022. 4. 26. 3-1. AWS Elastic Beanstalk + AWS S3로 웹 어플리케이션 배포하기 ■ React + Flask + GraphQL 웹 어플리케이션 프로젝트 전체 로드맵 React & Flask & GraphQL 웹앱 프로젝트 시작 🏁 이번에 리액트와 플라스크를 활용해 프로젝트를 할 기회가 생겼다. 거기에 GraphQL API에서 필요한 데이터들을 CRUD 해야 했는데, 이런 조합의 프로젝트 예시를 찾아보는 것이 쉽지 않았다 🥺 언젠 joy-able.tistory.com * 이 글의 전체 프로세스는 이 링크를 토대로 진행되었습니다. ■ AWS 계정 셋업 AWS 유저 만들기 1. AWS Management Console 에 로그인 2. IAM 콘솔을 연다 3. Users -> Add users 4. User 이름을 설정하고, 엑세스 방식 설정 - API, AWS CLI 에 대한 엑세스 권한.. 2022. 4. 22. 2-2. WSGI 서버 Gunicorn 사용하기 | React, Flask, GraphQL ■ React + Flask + GraphQL 웹 어플리케이션 프로젝트 전체 로드맵 React & Flask & GraphQL 웹앱 프로젝트 시작 🏁 이번에 리액트와 플라스크를 활용해 프로젝트를 할 기회가 생겼다. 거기에 GraphQL API에서 필요한 데이터들을 CRUD 해야 했는데, 이런 조합의 프로젝트 예시를 찾아보는 것이 쉽지 않았다 🥺 언젠 joy-able.tistory.com ■ Gunicorn 이란? 왜 쓰는 걸까? Gunicorn 이란? Gunicorn, 즉 Green Unicorn 은 UNIX를 위한 파이썬 WSGI(Web server Gateway Interface) HTTP 서버이다. Gunicorn은 웹 서버와 우리가 만든 웹 어플리케이션 중간에 일어나는 모든 일들을 담당한다고 보면.. 2022. 4. 21. 2-1. Flask에서 GraphQL 데이터 GET & POST | React, Flask, GraphQL ■ React + Flask + GraphQL 웹 어플리케이션 프로젝트 전체 로드맵 React & Flask & GraphQL 웹앱 프로젝트 시작 🏁 이번에 리액트와 플라스크를 활용해 프로젝트를 할 기회가 생겼다. 거기에 GraphQL API에서 필요한 데이터들을 CRUD 해야 했는데, 이런 조합의 프로젝트 예시를 찾아보는 것이 쉽지 않았다 🥺 언젠 joy-able.tistory.com ■ GraphQL GraphQL이란? GraphQL은 API(Application Programming Interface)를 위한 쿼리 언어이자 서버측 런타임으로 클라이언트에게 요청한 만큼의 데이터를 제공하는 데 우선 순위를 두는 언어이다. GraphQL은 특정 타입의 데이터 저장소(data store)를 쿼리하는 언어가.. 2022. 4. 19. 2. 백엔드 세팅 - Flask, Git/Github | React & Flask Web app ■ React + Flask + GraphQL 웹 어플리케이션 프로젝트 전체 로드맵 React & Flask & GraphQL 웹앱 프로젝트 시작 🏁 이번에 리액트와 플라스크를 활용해 프로젝트를 할 기회가 생겼다. 거기에 GraphQL API에서 필요한 데이터들을 CRUD 해야 했는데, 이런 조합의 프로젝트 예시를 찾아보는 것이 쉽지 않았다 🥺 언젠 joy-able.tistory.com ■ Git repository 만들기 1. 새로운 repository 만들기 - Repository 만드는 부분은 위의 링크에서 똑같이 하면 된다 :) 이름만 다르게 설정하면 됨! 2. Git Clone - 클론하는 과정은 똑같지만, VSC가 아닌 편의상 PyCharm에서 진행해본다. 파이썬을 기반으로한 플라스크 서버를 .. 2022. 3. 18. 1. 프론트엔드 세팅 - Git/Github으로 React 개발 환경 세팅 | React & Flask Web app ■ React + Flask + GraphQL 웹 어플리케이션 프로젝트 전체 로드맵 React & Flask & GraphQL 웹앱 프로젝트 시작 🏁 이번에 리액트와 플라스크를 활용해 프로젝트를 할 기회가 생겼다. 거기에 GraphQL API에서 필요한 데이터들을 CRUD 해야 했는데, 이런 조합의 프로젝트 예시를 찾아보는 것이 쉽지 않았다 🥺 언젠 joy-able.tistory.com ■ Git repository 만들기 1. 새로운 Repository 만들기 - Frontend와 Backend repository를 따로 만들 예정이다. 지금까진 별 생각 없이 프론트엔드와 백엔드를 같은 repo에 넣었는데, 사실 배포하면서 각각 다른 repo에 있는 것이 더 효율적이고 편하다는 것을 깨닫고 repo 대.. 2022. 3. 15. React & Flask & GraphQL 웹앱 프로젝트 시작 🏁 이번에 리액트와 플라스크를 활용해 프로젝트를 할 기회가 생겼다. 거기에 GraphQL API에서 필요한 데이터들을 CRUD 해야 했는데, 이런 조합의 프로젝트 예시를 찾아보는 것이 쉽지 않았다 🥺 언젠가 다시 보면서 도움이 되길 바라면서 기록으로 남겨보자 한다. 1. 프론트엔드 세팅 - React 2. 백엔드 세팅 - Flask 2-1. Flask에서 GraphQL 데이터 GET & POST 2-2. WSGI 서버 Gunicorn 사용하기 3. 배포 - AWS 3-1. AWS Elastic Beanstalk + AWS S3로 웹 어플리케이션 배포하기 3-2. AWS Elastic Beanstalk + AWS S3 + CloudFront 에서 프론트엔드 - 백엔드 라우팅 2022. 3. 15. Postman : 개념 및 API request Postman 이란? Postman은 API를 만들고 테스트하는 플랫폼이다. 공유된 RESTful API를 분석하고, 자신이 직접 만든 API를 테스트하는 데 주로 쓰인다. 일반적으로 API를 테스트하려면 HTML 리퀘스트를 보내야 하는데, 이때 HTML이나 자바 스크립트로 코드를 짜서 테스트 구현 환경을 만들어 주어야 한다. 하지만 Postman을 활용하면 그 과정을 생략하고, 플랫폼 상에서 즉각적으로 API의 기능들을 테스트해볼 수 있다. Postman 설치 Postman 웹사이트에서 데스크탑 전용 어플리케이션을 받거나 로그인 후 브라우저에서 웹 앱 형태로 사용할 수 있다. API Requests 원하는 API를 사용하기 위해 Postman에서 request를 보낼 수 있다. Request를 통해서.. 2022. 1. 11. 이전 1 다음