This is a mono repo using Nx with an Angular frontend and a Nest.js backend that spawns Python processes to use pretrained ML models. I facilitates the creation of short articles with images, content and links to subjects on AP news and Wikipedia.
This app using the Enterprise Angular applications with NgRx and Nx pattern. Currently it is run locally to construct posts for two different frontend sites.
There are various utilities to create links for content on AP News and WIkipedia. It does a Wikimedia search for images related to the search trend and allows the user to select one or two images. The initial purpose of the app was to create a kind of face-off between a real life artist and a machine learning GAN image. These were posted on the site AI vs Art aka Tundra 64 which is hosted on Heroku.
The name Tundra 64 is derived from the original Heroku deployment URL. It is tied to the GitHub evening-tundra-07464 repo which holds the source code for the site.
The problem with the above site was that it was too slow for Search Engine Optimization (SEO) purposes. Angular in general is not as performant for SEO, so I create a React project with the same capabilities, but that was also too slow and the pages were not able to be indexed by Google. What did work was a Preact Server Side Generated (SSG) site based on Next.js. It creates Accelerated Mobile Pages (AMP) that perform well for SEO load in about a second. To achieve the speed, AMP uses inline styles which means the them use for Tundra is much more difficult to achieve. This is currently only a technological demonstration, and the styles are very rudimentary compared to the Tundra site.
Ruffmello.com Preact site site hosted on Netlify.
There is extensive documentation the records the development of all these features in the docs directory. Given that the Javascript tech space moves on so quickly, it's all becomes legacy code very quickly. Most likely some of the Nest.js code will live on in another project instead of continuing here.
Generally speaking it looks at current Google search trends and allows you to select a trend to create a post around.
Then the user can choose an image from Wikimedia, setup Wikipedia and AP News links as well as links for other news story sources.
Then the user can generate an image using the Toonify app which relies on a DCGAN pre-trained model.
The user can then generate a list of posts which can be used for publishing the articles.
Note the above content is from more recent content which is not ML generated.
nx serve nest-demo // start the nest server (this should be done from a regular Windows prompt)
npm run server // start the customer portal server
nx serve customer-portal // serve the front end with trends
nx serve trendy // original Tundra 64 app, now defunct
nx test auth // test the auth lib
nx test layout // test the layout lib
nx test products // test the products lib
nx test customer-portal // test the customer-portal app
nx e2e customer-portal-e2e // run the end-to-end tests
nx build customer-portal
nx build --prod customer-portal --stats-json
npm run bundle-report-customer-portal
python apps\hugging-face\src\hello.py // run the text summary script
A trend search for the nest-demo looks like this:
http://localhost:3333/api/images/Christina%20Applegate
A text search looks like this:
/api/text/:id, GET
http://localhost:3333/api/text/Christina%20Applegate
It will write a file: array.txt
Project Console: https://console.firebase.google.com/project/trendy2022/overview
Hosting URL: https://trendy2022.web.app
Run the server and then the customer-portal and the app will be served at: http://localhost:4200
You can also go directly to login: http://localhost:4200/auth/login
Use the following info from the server/db.json:
"username": "duncan",
"password": "123"
After login, you should see the same JSON returned with the addition of a token property in the network tab.
Clone the project and npm install the dependencies.
These directories need to be created manually at the moment if they don't already exist.
- ./apps/toonify/src/cartooned_img/test_img
- ./apps/toonify/src/cartooned_img/gen_image
- ./apps/toonify/src/cartooned_img/cartooned_img
- ./apps/nest-demo/src/app/bart/summaries
- ./apps/nest-demo/src/app/gan/bucket
- ./articles/
- ./posts
- ./dist/apps/public # images downloaded from wikimedia commons
Max portrait height: 960px. Max landscape height: 541px.
See the Original README for more details on setup and the way the project was originally constructed.
This project was generated using Nx.
🔎 Powerful, Extensible Dev Tools
Nx supports many plugins which add capabilities for developing different types of applications and different tools.
These capabilities include generating applications, libraries, etc as well as the devtools to test, and build projects as well.
Below are our core plugins:
- React
npm install --save-dev @nrwl/react
- Web (no framework frontends)
npm install --save-dev @nrwl/web
- Angular
npm install --save-dev @nrwl/angular
- Nest
npm install --save-dev @nrwl/nest
- Express
npm install --save-dev @nrwl/express
- Node
npm install --save-dev @nrwl/node
There are also many community plugins you could add.
Run nx g @nrwl/react:app my-app
to generate an application.
You can use any of the plugins above to generate applications as well.
When using Nx, you can create multiple applications and libraries in the same workspace.
Run nx g @nrwl/react:lib my-lib
to generate a library.
You can also use any of the plugins above to generate libraries as well.
Libraries are shareable across libraries and applications. They can be imported from @demo-app/mylib
.
Run nx serve my-app
for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.
Run nx g @nrwl/react:component my-component --project=my-app
to generate a new component.
Run nx build my-app
to build the project. The build artifacts will be stored in the dist/
directory. Use the --prod
flag for a production build.
Run nx test my-app
to execute the unit tests via Jest.
Run nx affected:test
to execute the unit tests affected by a change.
Run ng e2e my-app
to execute the end-to-end tests via Cypress.
Run nx affected:e2e
to execute the end-to-end tests affected by a change.
Run nx dep-graph
to see a diagram of the dependencies of your projects.
Visit the Nx Documentation to learn more.
Nx Cloud pairs with Nx in order to enable you to build and test code more rapidly, by up to 10 times. Even teams that are new to Nx can connect to Nx Cloud and start saving time instantly.
Teams using Nx gain the advantage of building full-stack applications with their preferred framework alongside Nx’s advanced code generation and project dependency graph, plus a unified experience for both frontend and backend developers.
Visit Nx Cloud to learn more.