Gatsby Webhooks and how to trigger the build from Strapi - reactjs

we are currently working on connecting the Strapi cms with the gatsby on the front end.
My question is - do we need to set up the Webhooks to trigger the build inside of the repo on the Bit Bucket or it needs to be triggered on a hosting?
If you know the solution I would really appreciate it if you could share the procedure with me cause I'm seeing a lot of different cases online but I wasn't able to find this specific one.
Our hosting is AWS S3, and Gatsby is fetching the data from Strapi via GraphQL.
Thank you, guys!

Here is an example that is deleted from the documentation - https://github.com/strapi/strapi/blob/daaf1392d217a5927ea40320881bfec3208c9927/docs/3.0.0-beta.x/guides/webhooks.md
That uses the model's life cycles but you can apply this logic with the new Webhook feature that is now builtin Strapi.

Related

Missing files Express API, Sequelize

Hello I’ve been working with Freelance developer for over 10 months developing a Project developer abandon the project one day to the next ghost me disappeared. Send me a file with the work he has done, but I’m missing a backend API
Architecture: (full project is NodeJS in Typescript)
Backend: Express API, Sequelize
Frontend: React 18
My question is there is anyway to recrive the files from the file manager from the server ? Or any other place
Currently, the website is live and working how would I be able to retrieve the files?
I truly appreciate it of anybody has any insight thank you
Unfortunately, the only way to get those missing files is if you or someone you know has access to the server where they are located.
Otherwise, all you can do is look at all frontend API calls to try and reverse-engineer the API based on: the data payload React sends, the URL it hits, the method it uses (GET, POST, etc) and the response it gets from the server currently.
Then you would be left with creating the end-point handlers inside of Express, and the logic for the database such as queries and models. It's a difficult task but you can do it if you look at enough of the other information you have available. Good luck and welcome to Stackoverflow!

How do I add auth to and deploy my React app with lambda api?

I have locally working code for a React front-end application, hooked up to a serverless framework lambda back-end (which in turn accesses S3 and RDS). I'm now at the stage where I need to add user authentication to both the front and back-end, as well as deploy my solution.
I have cobbled together a Cloudfront distribution and s3 static hosting for the React portion, with the api available as a secondary origin on /api/*, however this solution seems awkward, and I'm not sure it helps me tackle auth.
Other guides that I've found suggest AWS-Amplify, or SST, but I have no experience with either.
Am I close to a well-structured roll-your-own solution, or completely on the wrong track? I'm happy to spend a little longer on a clean and future-proof solution, but am not adverse to side-stepping to a well respected tool.
I opted to follow this guide on SST. Once I saw it did everything I could have wanted and more, I ported over my API and React code with minimal fuss. I wouldn't hesitate to recommend this guide (which leverages SST, Amplify and Cognito).

Common way to build and deploy a react web project

I finished a part of my project and bought a webspace with a domain and a database to publish on. So I create a React-Typescript project with followed structure:
API: has my controllers
BLL: the services
Question do I have to create a Build and publish it on the webspace, with the API, BLL... or only the Web component? So that the API, BLL... are on a seperate server and the fetches from the Web-Component are via IP:Port address?
What is the common way here?
The in and outs of web hosting is massively large problem space. And the strategies and approaches number in the thousands. I couldn't hope to do justice to that in a single answer. But in short, you probably want them on the same server, and you want your backend to deliver your front end assets to browsers somehow. And your frontend makes requests without a domain like /api/mydata/ to pull data from the same domain as the frontend. This question will likely get closed now, as it's way too broad to answer.
– Alex Wayne

NextJS advice for SSG/SSR and Google Analytics/cookies

I have a NextJS site which is statically generated at build (SSG).
There are two things I need to implement next
Google Analytics
GDPR compliant opt-in cookie options
The first one is easy enough to do, however i'm struggling with making this GDPR compliant.
The issue is I don't have access to cookies at server side when my site is statically generated. This means that without knowing whether the user has consented to cookies at the server, I can't serve (or not serve) the analytics script along with the rest of the page.
Possible solutions:
Handle everything at client side - ask for consent, then dynamically add the GA tag to the <head>. However i'm worried this will negatively effect the analytics, or break it altogether. Does anyone know?
Change my site to be server-side rendered (SSR). I'd love to avoid this if possible. I'm really happy with how fast the site is running with SSG. It's essentially just a basic blog so would be a shame to have to convert for the sake of analytics.
Any other ideas?...
If anyone has experience with this, whether they used Next or Nuxt, etc, your input would be greatly appreciated!
Thanks in advance
Use Google Tag Manager to manage everything, your GA integration and your cookie integration using something like CookieHub for example (How to set up Google Analytics through Google Tag Manager for Next-Js?)
GTM will allow you to trigger the GA script only if the user specified he accepts analytics cookies.
Eitherway you could use Vercel.com built in analytics since your website is using Next.js wich is Vercel's framework.

How to make Ionic app work with an API written in Laravel but still works offline

I would like to ask how to create an ionic app that talks to Laravel API but still works offline when there's no connection.
Let's say i have to write a quiz mobile app in Ionic and it requests for Laravel API to retrieve the questions as well as store the scores in db.
I'm just starting to learn Ionic and i'm really confused right now on how to approach this.
What confuses me most are:
Does the Ionic source live inside the Laravel source code w/c serves the API?
If i want the Ionic app to be installable, should the Laravel source code be included as well during the compilation process?
Thanks in advance for any help.
Your php or in general server side code is completely independent from your ionic application. If you want your app to work offline you should think about something like fetching a high number of information initially and work with this data without making any additional requests.
However your ionic app does only contain the frontend. You could implement some logic for local storage, but if you want to keep information hidden from the user (e.g. solutions) you have to put that logic on a dedicated server.
In the few details you provided, I can say the Laravel code does not live inside the ionic app. The ionic app is separate from the backend API by Laravel. You are possibly trying for a ReST based architecture where you communicate with your Laravel Server with an API. You need to keep those codes separate.
However without any internet, you won't be able to access those APIs, so you will just be able to show some static data, or you could serve from a DB and show later. For how to use the sqlite db you can look here
In your backend you can have an API like
http://example.com/api/v1/questions/1/
Which will fetch a question with options and if you want the app to have the answer for offline storage you may have that as well. When a user answers, you may check whether you have internet access and send answer and verify if you do, else you may save the answer in your DB and sync when you do have access. You can fetch multiple questions so that a user may answer multiple questions in case he/she will not have internet access.
Hope it helps. :)

Resources