반응형 깃허브39 깃허브 액션 - is-website-vulnerable로 웹사이트 취약점 점검하기 깃허브 데스크탑으로 프로젝트 관리하기 강의 오픈!! (인프런 바로가기) Git / GitHub 전체 링크 참고- https://github.com/lirantal/is-website-vulnerable- github-pages-deploy-action로 리액트 gh-pages 자동 배포하기 인터넷 서점 알라딘의 취약점을 점검하는 깃허브 액션을 만들어 보자. 링크에 있는 예제를 리포지토리의 .github/workflows/check-website.yml에 추가한다.name: Test site for publicly known js vulnerabilitieson: pushjobs: security: runs-on: ubuntu-latest steps: - name: Test for.. 2024. 4. 18. 깃허브 액션 - github-pages-deploy-action로 리액트 gh-pages 자동 배포하기 깃허브 데스크탑으로 프로젝트 관리하기 강의 오픈!! (인프런 바로가기) Git / GitHub 전체 링크 참고- gh-pages로 리액트 프로젝트 배포하기- https://docs.github.com/en/actions/using-jobs/assigning-permissions-to-jobs- https://github.com/JamesIves/github-pages-deploy-action 리포지토리에 코드가 push 되는 것과 깃허브 페이지를 배포하는 것은 별개의 작업이다. (npm run deploy)리포지토리에 push가 되면 페이지가 자동 배포되도록 깃허브 액션의 yml 파일을 만들어 보자. .github/workflows/push-and-deploy.yml을 만들어 보자. github-pa.. 2024. 4. 18. 깃허브 머메이드 - 활동 다이어그램 그리기 (Draw Activity Diagram using GitHub Mermaid) 깃허브 데스크탑으로 프로젝트 관리하기 강의 오픈!! (인프런 바로가기) Git / GitHub 전체 링크 참고- https://mermaid.js.org/syntax/flowchart.html 깃허브 머메이드를 이용해 활동(액티비티) 다이어그램을 그려보자. 머메이드에서 액티비티 다이어그램은 지원하지 않고 Flow Chart를 지원한다.```mermaid---title: Activity Diagram---flowchart TD A --> B ``` 좌우로 그리고 싶다면 "LR" 로 표기한다.```mermaidflowchart LR A --> B ``` 총 4가지 (TB = TD) 방식을 지원한다.TB - Top to bottomTD - Top-down/ same as top to b.. 2024. 3. 4. 깃허브 머메이드 - 상태 다이어그램 그리기 (Draw Statechart Diagram using GitHub Mermaid) 깃허브 데스크탑으로 프로젝트 관리하기 강의 오픈!! (인프런 바로가기) Git / GitHub 전체 링크 참고- https://mermaid.js.org/syntax/stateDiagram.html- 상태 다이어그램 깃허브 머메이드를 이용해 상태 다이어그램을 그려보자. "[*]"로 Initial State와 Final State를 표시할 수 있고, "-->" 로 transition을 표현할 수 있다.transition 옆에 ":" 로 텍스트를 추가할 수 있다.```mermaid---title: Statechart Diagram--- stateDiagram-v2 [*] --> Source Source --> Target : event [guard] / action Target --> [*.. 2024. 3. 3. 깃허브 머메이드 - 시퀀스 다이어그램 그리기 (Draw Sequence Diagram using GitHub Mermaid) 깃허브 데스크탑으로 프로젝트 관리하기 강의 오픈!! (인프런 바로가기) Git / GitHub 전체 링크 참고- https://mermaid.js.org/syntax/sequenceDiagram.html- 시퀀스 다이어그램 깃허브 머메이드를 이용해 시퀀스 다이어그램을 그려보자. actor나 participant로 오브젝트(or Role)를 생성할 수 있고 as를 이용해 nickname을 만들 수 있다.```mermaid---title: Sequence Diagram example--- sequenceDiagram actor A participant B actor C as Cookie participant D as Dragon A ->> B : step 1 .. 2024. 3. 2. 깃허브 머메이드 - 클래스 다이어그램 그리기 (Draw Class Diagram using GitHub Mermaid) 깃허브 데스크탑으로 프로젝트 관리하기 강의 오픈!! (인프런 바로가기) Git / GitHub 전체 링크 참고- https://mermaid.js.org/syntax/classDiagram.html- 클래스 다이어그램 깃허브 머메이드를 이용해 클래스 다이어그램을 그려보자. 비주얼 스튜디오 코드에서 mermaid를 검색하면 Preview 플러그인을 다운 받을 수 있다. 플러그인을 설치하면 아래와 같이 클래스 다이어그램을 미리볼 수 있다.클래스 다이어그램 화살표 머메이드에서 아래 코드를 작성해보자.```mermaid---title: Class Diagram example--- classDiagram classA 클래스의 관계는 다이어그램에서 아래와 같이 화살표로 정의된다. (레퍼런스마다 모양이 .. 2024. 1. 27. 깃허브 액션 - Schedule로 반복 작업하기 깃허브 데스크탑으로 프로젝트 관리하기 강의 오픈!! (인프런 바로가기) Git / GitHub 전체 링크 참고- https://docs.github.com/en/actions/using-workflows/events-that-trigger-workflows#schedule 아래의 yml을 repo의 .github/workflow에 추가해 보자. (just-10-minutes.yml)name: Every 10 Minutes scheduleon: schedule: - cron: '*/10 * * * *' jobs: ten_minutes_schedule_job: runs-on: ubuntu-latest steps: - name: Display current time .. 2024. 1. 7. 깃허브 액션 - Push 될 때 메일 보내기 (Send Email using GitHub Actions) 깃허브 데스크탑으로 프로젝트 관리하기 강의 오픈!! (인프런 바로가기) Git / GitHub 전체 링크 참고- Node JS + jest를 GitHub Actions로 실행하기- nodemailer로 구글, 네이버, 다음 카카오 메일 보내기- 메일 알림 설정하기 깃허브 액션을 이용하여 repo에 push될 때마다 메일을 보내보자. 먼저 링크를 참고하여 아래의 sendEmail.js를 repository에 저장하자.참고로 gmail의 경우 from을 설정할 필요가 없다.const nodemailer = require('nodemailer');async function sendEmail() { const transporter = nodemailer.createTransport({ service: .. 2023. 12. 16. 리액트 - 쿠키로 GitHub OAuth 로그인 인증 관리하기 with react-cookie 리액트 전체 링크 Git / GitHub 전체 링크 참고 - 로컬 스토리지 사용 방법과 세션 스토리지 비교 - 댓글 기능 만들기 with react-comments-section - 로그인한 사용자만 댓글 기능 사용하기 - GitHub RESTful API로 댓글 저장하기 - 리액트 쿠키로 GitHub OAuth 로그인 인증 관리하기 - Mui Pagination으로 댓글 페이지로 나누기 현재 로그인 인증은 로컬 스토리지를 이용하여 처리하였다. react-cookie를 이용하여 로그인 인증 정보를 관리해보자. 로컬 스토리지와 쿠키의 차이는 다음과 같다. 로컬 스토리지 쿠키 용량 최소 5MB 이상 최대 4KB 전송 서버에 자동 전송 X (직접 구현) HTTP 요청 헤더에 자동 포함 수명 만료 기간 미설정시.. 2023. 11. 15. 이전 1 2 3 4 5 다음 반응형