Coder Social home page Coder Social logo

franktylerva / k8s-micro-frontend Goto Github PK

View Code? Open in Web Editor NEW
0.0 2.0 0.0 373 KB

An example approach to micro-frontends on kubernetes

Dockerfile 4.17% HTML 32.14% CSS 17.37% JavaScript 29.96% Smarty 16.36%
micro-frontend github-actions helm nginx multi-stage-build kubernetes-deployment

k8s-micro-frontend's Introduction

This project demonstrates an approach to having separate, versioned frontend projects merged into one kubernetes pod via init containers. Each init container should copy it's part of the application into a directory called shared-data. This directory is mapped to a directory that is mounted by the nginx container for serving up the applications. This example separates the application by feature, but one could use any technique to separate projects that makes sense. Each feature is served up by nginx on a path that represents the feature. So /feature-a for feature-a and /feature-b for feature-b. Features in this project can be added via the helm charts values file under the key features. The helm chart is located under the helm directory. Execute the following command to install the example:

helm upgrade micro-frontend helm --install

Run the following commands to build feature-a:

cd feature-a
export PUBLIC_URL=/feature-a
yarn build
docker build -t feature-a:1.0.0 .

Run the following commands to build feature-b:

cd feature-b
export PUBLIC_URL=/feature-b
yarn build
docker build -t feature-b:1.0.0 .

k8s-micro-frontend's People

Contributors

franktylerva avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.