In my organization we have multiple independent SPAs, each has its own code repo on github under the same closed organization.
I want to have my SPA "host" another SPA, without redirecting the user out of my app, and just allow him to use the other app through mine. Converting to Monorepo is not an option. What is the recommended way achieving that goal?
Related
I am an aspiring developer. I have cloned Emilio Quintanas Servitodo APP into my own repository. I downloaded the repo, and used gh-pages with npm to build and deploy the APP, but the links are not working.
When my homepage is jsitges.github.io/ I get the error "no shallow build allowed" but when I build to jsitges.github.io/servitodo the paths to the app are not configured correctly.
https://github.com/jsitges/servitodo
I may have the same problem as posted in this question, I will try later today, but to me that is the most obvious solution so far.
I am assuming I have a question regarding history, the solution to that:
git clone <git_url>
delete the .git repository from your folder. Which will delete all your history.
The you can do a
git init
which will create an entirely new git project for you.
This may not be the best way. But this will work . Hope it helps.
So last, is the question of wether this is a valid question at all, The initial challenge was to build an app. TO THIS AVAIL, i copied emilio Quintana's app. But did not include the API part.
NOW I have also cloned the API for his app, but how can I learn how to publish the react app along with it's API. These are the Features he implemented:
React Router to enable client side rendering and optimized performance.
Utilized JSON Web Tokens and localStorage to store encrypted user information client-side.
Developed a Rails API using a PostgreSQL database with endpoints for users, jobs and professionals.
Implemented user interface employing React and Redux with Material UI for styling.
Utilized Stripe Elements to enable credit card payments.
And the Tech Stack he used
React & Redux and Material UI.
What does this mean? tech Stack? I infere what that means, but where can i costumize his app so that I can basically copy its inner workings and have it served from gh-pages.
Thanks in advance.
I am creating a react-native application, And the application having many module like
Login Module
Payment
Cart
Product etc.
So I want to follow Micro Frontend Architecture for each module. I have searched on internet but did not find anything. So I want to know is it possible to achieve Micro Frontend Architecture for React-Native application. If yes then How ?
You can use Re.Pack, which is Webpack toolkit for React Native. Since v3 it provides its own ModuleFederationPlugin, which allows you to set up Module Federation (MF) architecture of building micro-frontends.
Example MF app can be found here: https://github.com/callstack/repack-examples/tree/main/module-federation. It covers a basic example of 2 mini-apps loaded dynamically from a "host" app.
There are no proper solutions for RN Micro-frontend so far.
there are a few libraries that may help you to achieve this.
https://github.com/callstack/react-native-brownfield
React Native Wix
But these are not recommended
kindly go through this link so you will be more clear about your question.
https://www.reddit.com/r/reactnative/comments/jdpfrj/microservices_in_react_native/
Microfrontends are concept originating from Web apps world. Achieving the same paradigm on mobile/React Native is possible, e.g. by using Re.Pack, but requires a quite complex setup. On the other hand, using Re.Pack will give you more app superpowers, like dynamically loading bundle splits from Internet.
As a simpler alternative, I would suggest setting up a monorepo containing separate NPM packages for each of the modules. This way you can achieve code separation more natural for mobile apps paradigm.
My question concerns programming a full-stack app.
On the frontend, I have a Next.js React app. I want to render it on the client-side and probably use SWR. On the backend, I have a Django app with a PostgreSQL database.
I have seen two approaches to make all of these work together.
The first one is to use Django to serve Next.js React app with django-webpack-loader and then to load React app within Django template.
The second one is to build two separate apps - frontend (Next.js) and backend (Django + PostgreSQL) and deploying them on two servers (e.g. Docker container).
I have read this article and it makes me lean towards the second option. However, it is a pretty old solution and maybe some things have changed since then.
What is the most optimal solution when it comes to connecting Next.js React Client-side rendered, Django and PostgreSQL?
Opinions may differ, but based on reading and personal experience, I consider using separate Next.js and Django apps to be preferable. This (1) helps with separation of concerns, (2) helps avoid making Django or Next.js do anything that their designers did not anticipate, and (3) is simple with Docker.
Here's an example project that uses docker-compose to manage services including a Next.js frontend, Django backend, and Postgres database: https://github.com/ModularHistory/modularhistory
I'm trying to create a ReactJS web app that I can use on multiple websites (clone ?), while it fetches data from a centralized API.
The goal is to develop one app, which I can improve and update, of which I automatically deploy to each website.
What's the best approach to do that?
maybe the simplest way is to have one repositroy all your website use the same repo for your react js app. And you can add and .env file for each website that contain a specifique configuration for each app.
this way you will share the same app , you update one repo and update is shared cross your websites.
One way to solve this I discovered to create environment variables that get passed to the backend through a custom header for example. It's a way of creating a SaaS website.
When creating an app with create-react-app,there is only one index.html,does that means React can only handle one SPA at a time? What if I want to develop multiple pages? Should I create another SPA with create-react-app and then put them together after building each of them?
Update:
Parceljs can do that. here is docs.
You can use Parcel instead of Webpack (which being used in create-react-app) and it provide you zero config environment to develop web apps (using react or anything else).
Having multiple pages (instead of SPA) is not what most React environments had in mind [before - see update above].
You can have different page URL's using react-router or similar client side routing solutions.
If the concern is bundle size, there are solutions using webpack or parcel to lazy load each bundle whenever they needed or cache bundle (using service workers) and so on (Tree shaking, ...). (check Code Splitting in React Docs)
Other concern I might have in my brain is SEO, in this case you may find Isomorphic app (react server side rendering) useful which initialize first view of requested URL HTML and sends it to client, then client will load react and react will take control of UI. This will help Google (or other search engines) find your URLs fast and user experience in transitions between pages will remain seamless.