Data

Tools

Indexes

Applications

Experiments

Open Source Science

angular-react-microfrontend

:construction: React vs Angular ? Why not both ! Micro frontend demo using Angular and React alongs with a NodeJS API

https://github.com/billyjov/angular-react-microfrontend

Science Score: 44.0%

This score indicates how likely this project is to be science-related based on various indicators:

  • ✓
    CITATION.cff file
    Found CITATION.cff file
  • ✓
    codemeta.json file
    Found codemeta.json file
  • ✓
    .zenodo.json file
    Found .zenodo.json file
  • ○
    DOI references
  • ○
    Academic publication links
  • ○
    Committers with academic emails
  • ○
    Institutional organization owner
  • ○
    JOSS paper metadata
  • ○
    Scientific vocabulary similarity
    Low similarity (6.9%) to scientific vocabulary

Keywords

angular angular-elements micro-frontend micro-frontends microfrontend microfrontends-demo reactjs typeorm web-components

Keywords from Contributors

mesh sequences interactive hacking
Last synced: 6 months ago · JSON representation ·

Repository

:construction: React vs Angular ? Why not both ! Micro frontend demo using Angular and React alongs with a NodeJS API

Basic Info
  • Host: GitHub
  • Owner: billyjov
  • License: mit
  • Language: TypeScript
  • Default Branch: master
  • Homepage:
  • Size: 3.37 MB
Statistics
  • Stars: 26
  • Watchers: 2
  • Forks: 15
  • Open Issues: 4
  • Releases: 0
Topics
angular angular-elements micro-frontend micro-frontends microfrontend microfrontends-demo reactjs typeorm web-components
Created about 7 years ago · Last pushed 9 months ago
Metadata Files
Readme License Citation

README.md

angular-react-microfrontend

microfrontend demo using Angular and React alongs with a NodeJS API

🎨 Stack

🏗️ Global architecture

Architecture

Angular app modules view

Angular module view

React app component structure

React components

🔧 Installation

Adjust persistence settings with your local configuration. Just Change host and port and the database name inside the ormconfig.json located at src/server/ormconfig.json.

json { "type": "mysql", "host": "localhost", "port": 3306, "username": "root", "password": "", "database": "microfrontends", "synchronize": true, "entities": [ "api/entities/*.ts" ], "subscribers": [ "api/subscribers/*.ts" ], "migrations": [ "api/migrations/*.ts" ], "cli": { "entitiesDir": "api/entities", "migrationsDir": "api/migrations", "subscribersDir": "api/subscribers" } }

🏃 Running

Start the Server

  • Start your MySQL Database
  • Run the server

Open your terminal and run following commands:

bash $ cd src/server $ npm install or yarn install $ npm run dev or yarn dev

  • Run the client

bash $ cd src/client/todolist $ npm install or yarn $ npm run build:elements or yarn build:elements $ cd .. $ cd todo-details $ npm install or yarn $ npm run start or yarn start

:rotating_light: Run Tests

Run NodeJS Tests

bash $ cd src/server/ $ npm run test or yarn test

Run Angular Tests

bash $ cd src/client/todolist $ npm run test or yarn test

Run ReactJS Tests

bash $ cd src/client/todo-details $ npm run test or yarn test

📄 Licence

Built with all :heart: of the world by Billy Lando.

MIT License (MIT) © Billy Lando

Owner

  • Name: Billy Lando
  • Login: billyjov
  • Kind: user
  • Location: Germany
  • Company: @teamneusta

Javascript enthusiast. Passionate @angular @nodejs evangelist 🎨. ✅TDD = 🔨 Refactoring + 🚨TFD

Citation (CITATION.cff) 

message: "If you use this proof of concept software, please cite it as below."
authors:
  - family-names: Lando
    given-names: Billy
title: "Angular-React-Microfrontend"
version: 0.4.0
date-released: 2024-05-07
identifiers:
  - description: React vs Angular ? Why not both ! Micro frontend demo using Angular and React alongs with a NodeJS API
license: MIT
repository-code: "https://github.com/billyjov/angular-react-microfrontend"

GitHub Events

Total
  • Watch event: 3
  • Push event: 1
  • Fork event: 1
Last Year
  • Watch event: 3
  • Push event: 1
  • Fork event: 1

Committers

Last synced: over 1 year ago

All Time
  • Total Commits: 103
  • Total Committers: 3
  • Avg Commits per committer: 34.333
  • Development Distribution Score (DDS): 0.233
Past Year
  • Commits: 3
  • Committers: 1
  • Avg Commits per committer: 3.0
  • Development Distribution Score (DDS): 0.0
Top Committers
Name Email Commits
Billy Lando b****o@y****m 79
dependabot[bot] 4****] 22
Billy Lando b****o@n****e 2
Committer Domains (Top 20 + Academic)
neusta.de: 1

Issues and Pull Requests

Last synced: 10 months ago

All Time
  • Total issues: 2
  • Total pull requests: 173
  • Average time to close issues: about 22 hours
  • Average time to close pull requests: 11 months
  • Total issue authors: 1
  • Total pull request authors: 1
  • Average comments per issue: 1.0
  • Average comments per pull request: 0.8
  • Merged pull requests: 35
  • Bot issues: 0
  • Bot pull requests: 173
Past Year
  • Issues: 0
  • Pull requests: 0
  • Average time to close issues: N/A
  • Average time to close pull requests: N/A
  • Issue authors: 0
  • Pull request authors: 0
  • Average comments per issue: 0
  • Average comments per pull request: 0
  • Merged pull requests: 0
  • Bot issues: 0
  • Bot pull requests: 0
View more stats
Top Authors
Issue Authors
  • billyjov (2)
Pull Request Authors
  • dependabot[bot] (103)
Top Labels
Issue Labels
Pull Request Labels
dependencies (102)

Dependencies

src/client/todo-details/package-lock.json npm
  • 1338 dependencies
src/client/todo-details/package.json npm
  • enzyme ^3.10.0 development
  • enzyme-adapter-react-16 ^1.14.0 development
  • react-test-renderer ^16.8.6 development
  • bootstrap ^4.3.1
  • material-icons ^0.3.1
  • react ^16.8.6
  • react-dom ^16.8.6
  • react-scripts ^3.0.1
src/client/todo-details/yarn.lock npm
  • 1372 dependencies
src/client/todolist/package-lock.json npm
  • 1146 dependencies
src/client/todolist/package.json npm
  • @angular-devkit/build-angular ~12.2.3 development
  • @angular/cli ~12.2.3 development
  • @angular/compiler-cli ^12.2.4 development
  • @angular/language-service ~12.2.4 development
  • @types/jasmine ~3.6.0 development
  • @types/jasminewd2 ~2.0.3 development
  • @types/node ^12.11.1 development
  • @webcomponents/webcomponentsjs ^2.2.4 development
  • codelyzer ^6.0.0 development
  • jasmine-core ~3.6.0 development
  • jasmine-spec-reporter ~5.0.0 development
  • karma ~6.3.2 development
  • karma-chrome-launcher ~3.1.0 development
  • karma-coverage-istanbul-reporter ~3.0.2 development
  • karma-jasmine ~4.0.0 development
  • karma-jasmine-html-reporter ^1.5.0 development
  • karma-mocha-reporter ^2.2.5 development
  • protractor ~7.0.0 development
  • ts-node ~7.0.0 development
  • tslib ^2.0.0 development
  • tslint ~6.1.0 development
  • typescript ~4.3.5 development
  • @angular/animations ~12.2.4
  • @angular/common ~12.2.4
  • @angular/compiler ~12.2.4
  • @angular/core ~12.2.4
  • @angular/elements ^12.2.4
  • @angular/forms ~12.2.4
  • @angular/platform-browser ~12.2.4
  • @angular/platform-browser-dynamic ~12.2.4
  • @angular/router ~12.2.4
  • @webcomponents/custom-elements ^1.2.1
  • bootstrap ^4.3.1
  • core-js ^2.5.4
  • document-register-element ^1.7.2
  • material-icons ^0.3.0
  • rxjs ~6.6.7
  • zone.js ~0.11.4
src/server/package-lock.json npm
  • 712 dependencies
src/server/package.json npm
  • @types/body-parser ^1.17.0 development
  • @types/express ^4.16.0 development
  • @types/jest ^23.3.13 development
  • @types/supertest ^2.0.7 development
  • jest ^24.5.0 development
  • nodemon ^1.18.9 development
  • supertest ^3.4.2 development
  • ts-jest ^23.10.5 development
  • ts-node ^7.0.1 development
  • tsconfig-paths ^3.7.0 development
  • typescript ^3.2.2 development
  • body-parser ^1.18.3
  • express ^4.16.4
  • mysql ^2.16.0
  • typeorm ^0.2.25
src/client/package-lock.json npm