How to Deploy React App (any static website) to S3 and CloudFront? (CI/CD Pipeline | GitHub Actions)

แชร์
ฝัง
  • เผยแพร่เมื่อ 13 ต.ค. 2024

ความคิดเห็น • 44

  • @AntonPutra
    @AntonPutra  ปีที่แล้ว +1

    🔴 - To support my channel, I’d like to offer Mentorship/On-the-Job Support/Consulting - me@antonputra.com

  • @TheVSI
    @TheVSI หลายเดือนก่อน +1

    thank you, this was extremely helpful and ive succesfully deployed my site

    • @AntonPutra
      @AntonPutra  หลายเดือนก่อน

      my pleasure!

  • @Rayhand117
    @Rayhand117 หลายเดือนก่อน +1

    You Helped me again and again!
    Thanks a lot!

    • @AntonPutra
      @AntonPutra  หลายเดือนก่อน +1

      thank you!!my pleasure!!

  • @kiranbakale8207
    @kiranbakale8207 2 หลายเดือนก่อน +1

    Thanks anton, keep up the good work

    • @AntonPutra
      @AntonPutra  2 หลายเดือนก่อน +1

      thank you!

  • @hamzazbili6803
    @hamzazbili6803 ปีที่แล้ว +5

    thank you! The only helpful video I could find

  • @hanniep8489
    @hanniep8489 6 หลายเดือนก่อน

    Great tutorial!!! Very clear explanation on what to do and why we do it!

    • @AntonPutra
      @AntonPutra  6 หลายเดือนก่อน

      Thank you!

  • @bangarisaiswaraj
    @bangarisaiswaraj 9 หลายเดือนก่อน

    Very well organised video. Thanks Anton!

  • @programm4you
    @programm4you ปีที่แล้ว +1

    Спасибо, дружище, упростил мне жизнь! Все получилось и даже без policy/role, все уже было настроено.

  • @datatechnology9213
    @datatechnology9213 ปีที่แล้ว +2

    Great Thanks. Everything on Point 👌👍

  • @ftowork19office88
    @ftowork19office88 2 ปีที่แล้ว +3

    Thank you! it was awesome

  • @AntonPutra
    @AntonPutra  ปีที่แล้ว +1

    👉 How to Manage Secrets in Terraform - th-cam.com/video/3N0tGKwvBdA/w-d-xo.html
    👉 Terraform Tips & Tricks - th-cam.com/video/7S94oUTy2z4/w-d-xo.html
    👉 ArgoCD Tutorial - th-cam.com/video/zGndgdGa1Tc/w-d-xo.html

  • @olawaseem
    @olawaseem 2 ปีที่แล้ว +2

    what was cost for hosting in aws and domain from google?

    • @AntonPutra
      @AntonPutra  2 ปีที่แล้ว +1

      hosting is really depend on the usage, my website almost cost me nothing, domain from $12 per year

  • @attinderpalsingh5745
    @attinderpalsingh5745 ปีที่แล้ว

    What if my project has environment variables ? Is there any way i can save them anywhere? Not on GitHub and local ?

    • @AntonPutra
      @AntonPutra  ปีที่แล้ว

      Perhaps you can add them to your CI/CD pipeline, but it would depend on the tools you are using.

  • @mikhailsh8916
    @mikhailsh8916 2 ปีที่แล้ว +3

    I like your video ))

  • @Thesanhokway
    @Thesanhokway ปีที่แล้ว

    Hi Anton, when I removed static hosting and allow access only to the cloud front, it's working fine but when I refresh the page, routing is not working. It is showing access denied. Could you help out in this?

    • @AntonPutra
      @AntonPutra  ปีที่แล้ว

      Sorry it's hard for me to debug, check if you disable "block public access"

    • @Thesanhokway
      @Thesanhokway ปีที่แล้ว

      Thanks for the reply, Anton. The problem is solved by adding index.html to the errors page

    • @AntonPutra
      @AntonPutra  ปีที่แล้ว

      @@Thesanhokway got it

  • @babankumarsutradhar4544
    @babankumarsutradhar4544 2 ปีที่แล้ว +1

    What was cost cloudfront ?

    • @AntonPutra
      @AntonPutra  2 ปีที่แล้ว

      it's based on usage

  • @juliusoh
    @juliusoh ปีที่แล้ว

    how do you set up cloudfront for ALB for EKS?

    • @AntonPutra
      @AntonPutra  ปีที่แล้ว +1

      Not sure if I understand your question. If you need an ALB, you would use the AWS load balancer controller. CloudFront is typically used for static content that is distributed via CDN.

    • @juliusoh
      @juliusoh ปีที่แล้ว

      @AntonPutra I meant is it possible to put cloud front in front of alb?

  • @shivagangula2680
    @shivagangula2680 11 หลายเดือนก่อน

    how to access routing pages in cloud front i got access denied

  • @datatechnology9213
    @datatechnology9213 ปีที่แล้ว

    Subscribed 👍

  • @afkgaming3203
    @afkgaming3203 5 หลายเดือนก่อน

    Why is ur video so Zoomed in and you do not show ur cursor. Its difficult to undestand

    • @AntonPutra
      @AntonPutra  5 หลายเดือนก่อน

      thanks for the feedback, i don't do it anymore

  • @RezzaACM
    @RezzaACM ปีที่แล้ว +2

    Your name very Indonesian 😂. I think you are from Indonesia 😂

    • @AntonPutra
      @AntonPutra  ปีที่แล้ว +1

      Yeah i get it a lot, i was told my last name translates as son =)

  • @harriottgaige5871
    @harriottgaige5871 2 ปีที่แล้ว +2

    𝖕𝖗𝖔𝖒𝖔𝖘𝖒 👍

  • @gareebsportscricket2984
    @gareebsportscricket2984 11 หลายเดือนก่อน

    thank you

  • @mohamedaslam6619
    @mohamedaslam6619 ปีที่แล้ว

    brother i ahving this error in github actions can you help me at
    new ClientRequest (node:_http_client:284:14)
    at Object.request (node:https:357:10)
    at features.constructor.handleRequest (/home/runner/.npm/_npx/55947e5ced8dc5f0/node_modules/aws-sdk/lib/http/node.js:45:23)
    at executeSend (/home/runner/.npm/_npx/55947e5ced8dc5f0/node_modules/aws-sdk/lib/event_listeners.js:418:29)
    at Request.SEND (/home/runner/.npm/_npx/55947e5ced8dc5f0/node_modules/aws-sdk/lib/event_listeners.js:432:9)
    at Request.callListeners (/home/runner/.npm/_npx/55947e5ced8dc5f0/node_modules/aws-sdk/lib/sequential_executor.js:102:18)
    at Request.emit (/home/runner/.npm/_npx/55947e5ced8dc5f0/node_modules/aws-sdk/lib/sequential_executor.js:78:10)
    at Request.emit (/home/runner/.npm/_npx/55947e5ced8dc5f0/node_modules/aws-sdk/lib/request.js:686:14)
    at Request.transition (/home/runner/.npm/_npx/55947e5ced8dc5f0/node_modules/aws-sdk/lib/request.js:22:10) {
    code: 'NetworkingError',
    region: 'us-east-1',
    hostname: 'cloudfront.amazonaws.com',
    retryable: true,
    time: 2022-11-06T15:05:33.025Z
    }
    node:internal/process/promises:279
    triggerUncaughtException(err, true /* fromPromise */);
    ^
    [UnhandledPromiseRejection: This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). The promise rejected with the reason "Invalidate error: NetworkingError [ERR_INVALID_CHAR]: Invalid character in header content ["Authorization"] (NetworkingError [NetworkingError]: Invalid character in header content ["Authorization"]
    at ClientRequest.setHeader (node:_http_outgoing:647:3)
    at new ClientRequest (node:_http_client:284:14)
    at Object.request (node:https:357:10)
    at features.constructor.handleRequest (/home/runner/.npm/_npx/55947e5ced8dc5f0/node_modules/aws-sdk/lib/http/node.js:45:23)
    at executeSend (/home/runner/.npm/_npx/55947e5ced8dc5f0/node_modules/aws-sdk/lib/event_listeners.js:418:29)
    at Request.SEND (/home/runner/.npm/_npx/55947e5ced8dc5f0/node_modules/aws-sdk/lib/event_listeners.js:432:9)
    at Request.callListeners (/home/runner/.npm/_npx/55947e5ced8dc5f0/node_modules/aws-sdk/lib/sequential_executor.js:102:18)
    at Request.emit (/home/runner/.npm/_npx/55947e5ced8dc5f0/node_modules/aws-sdk/lib/sequential_executor.js:78:10)
    at Request.emit (/home/runner/.npm/_npx/55947e5ced8dc5f0/node_modules/aws-sdk/lib/request.js:686:14)
    at Request.transition (/home/runner/.npm/_npx/55947e5ced8dc5f0/node_modules/aws-sdk/lib/request.js:22:10))".] {
    code: 'ERR_UNHANDLED_REJECTION'
    }
    Error: The process '/usr/local/bin/npx' failed with exit code 1