Problems with create-react-kotlin-app and backend - javascript

Question
I want to deploy my application on the server in production but I am struggling to do so.
When I use npm run build to produce an "Optimized" version of the app and launch it with serve, it doesn't seem to use the proxy.
Going back to the dev server with npm start, I get this error:
TypeError: Kotlin.defineModule is not a function
I cannot get out of this. Has someone got a similar configuration? How did you make it work in production? Do you use something to proxy the requests to your backend?
App configuration
Frontend:
Web app using create-react-kotlin-app in kotlin, react. It's on localhost:3000 (dev-server) and has a proxy to localhost:3001 (the backend).
Backend
Backend, which is a simple express router for auth and data managment from the database.
Thanks in advance

I'll go back and answer my question,
One is a bug on their side:
https://youtrack.jetbrains.com/issue/CRKA-66
I'm using a config that maybe is not ideal:
I copy the build folder that contains the optimized folder into the backend and I serve the main view "index.html" as an entry point using sendFile().
I then use the url and args to route the user into various react components pages, maybe in the future it's best to switch to: https://github.com/JetBrains/kotlin-wrappers/tree/master/kotlin-react-router-dom

according with the repo documentation, if you are getting Kotlin.defineModule is not a function you would need to run:
rm -rf node_modules/.cache

Related

Hosting NestJS app on Phusion Passenger when hosting provider expects app.js file

I am currently working on a project related to my university and I would like people from my organization to be able to see my progress. My hosting provides the ability to run Node.js server, however it's refering to the app.js file which NestJS project doesn't have as it's being run through the command line (npm run start). Is there any way to run such application, for example by creating an app.js file which would be able to run the command?
Thank you for any assistance with this case.
PS. Server is running Phusion Passenger.
Phusion Passenger error message
If the server expects an app.js file and can't be customized to use something else, then you could have an app.js in your root directory that requires('./dist/main.js') and that's it. This would mean that your hosting service has to build the typescript code to javascript first, but that's hopefully something supported. If it isn't then you can do
// app.js
require('ts-node').register(); // you can pass extra options here
require('./src/main.ts');
It's not something I'd immediately recommend, but it would make the project runnable.

Heroku deployment for React app getting a 404

I've made a react project that uses nodejs, graphql, apollo, express, and mongo DB.
I'm struggling to get it deployed through Heroku.
first, when I deployed it, it failed and said I needed to add a build pack. I've gone through and gotten an idea of what buildpacks are. However, I'm more vague on if I need multiple buildpacks for my application. So I've added both a nodejs buildpack and a create-react-app buildpack. This is the furthest I've reached as it deploys with a 404 error.
One thing to note is that that the nodejs buildpack requires a package.json file in the root folder, though mine were both in my client and server folders. Not sure if I structured it wrong? So I went ahead and npm init in the root folder to create a package.json not knowing if that's an adequate solution.
I've checked the Heroku logs and getting a few errors it seems:
herokulogs
I've also read somewhere about maybe needing a profile? which is not something I entirely understand yet.
As you can tell, I'm new to this and still learning a lot. I'm hoping someone can point me in the right direction as I'd like to see this thing through. Please let me know if you'd like to have access to my codebase.
Thanks
It seems, that npm start throws that error. How did you defined it in your package.json and can you execute it on your local machine?
Have you read the documentation for the Node.js Buildpack?
I'm assuming that you are using one heroku server for both front-end and back-end.
If so, they must be separate.

How do I run my react front-end and express back-end together?

I'm attempting to build a simple react/node/express app from scratch (not using the create-react-app). I've built out a simple back end to pass some data to the front end but am having a hard time figuring out how the two communicate. How can I run the front-end and back-end together and view the front-end with the data passed into it?
I'd like to do this all in one command. Do I have to use a tool like webpack to bundle everything together into one runnable package?
My repo can be found here, it is the react-and-express branch that I've linked to. Any help is much appreciated! Currently I'm running the app by starting index.js but that is only the backend, how do I run my front-end App.js and get the two to communicate?
https://github.com/int-a/contacts-application/tree/react-and-express
You can use concurrently to run two node commands at the same time (1 for front-end and 1 for back-end). And then use the proxy configuration in webpack dev server to alias the calls to the backend port number for the same machine.

Module not found: Error: Can't resolve 'dns' when using MongoDB

I'm new to Reactjs, Nodejs and MongoDB. I'm currently trying to change Mediums snowflake tool to store users scores in a database. I have installed yarn, mongodb and mongodb-core through npm. It is a single page web application which is what I think is causing me trouble. I add
var MongoClient = require('mongodb');
To SnowflakeApp.js and encounter the following error:
Module not found: Error: Can't resolve 'dns' in
'/home/mlAHO174/snowflake/node_modules/mongodb-core/lib'
I've tried googling this error and have discovered it could be a range of things. I'm not sure if it is because React is front end and I'm trying to alter back end or because mongoDB is installed incorrectly. I'm new to this so would be grateful for help!
DNS is a core module of Node.JS. Telling people they need to install DNS via NPM will end up with them having a completely different module that does something else.
https://nodejs.org/api/dns.html vs https://www.npmjs.com/package/dns
This error most likely means you are trying to do something from the client-side that needs to be done on the server-side. If MongoDB module can't find the DNS component, it's running on the client-side.
MongoDB has to run on the server. In order to access data from React dynamically you'll need to set up an API using something like Express or Apollo.
Update:
A great way to do this is with Azure Functions (TypeScript) or AWS (Lambda) functions
For anyone who encounters this Error while importing the clientPromise (like in the with-mongodb template):
Make sure you're in the /pages/ directory!
It won't work in other directories like /components.
(and you should take a break or get some coffee...)
The problem is that you are trying to connect to the database from the front end. If this were possible that would open up a whole world of security issues. You need to set up your database connections on the backend and then have the front end make requests to the backend to handle the database.
I solved this by installing and using 'bson' instead of 'mongodb' for the client part of the code. 'bson' has a tiny bit of what 'mongodb' has and it might have what you are looking for. 'bson' is built for the browser.
In my case I needed the "ObjectId" in the browser and pulling it in from 'bson' did the trick as I didn't want to reference 'mongodb' because of the error described in the OP.
The other answers are also correct depending on why you're getting this error.
I think - mongo package is meant to be run on servers only, not in the browser.
It does not work in Next.js pages file components too, but does work in getStaticProps, getServerSideProps, getStaticPaths etc - because they run on the server, not the client.
Alternative - use Firebase Realtime database, you can access it in client-side code too. Example - a website (say a React app) that is hosted on GitHub pages or some other static server, but doesn't have a web app server (aka backend).
welcome to stack overflow.
You need to understand and learn few basics of web-applications. There's frontend, backend and a layer between them and a layer between backend and database. Frontend includes react.js, angular.js or anything else that is on browser. Backend is used to take request from frontend, providing API's to frontend and ask for data from other API's or database. Database includes sql, no-sql.
The error you are facing if of a NPM module mongodb-core.js. Either it's not installed properly, or installed using wrong version of module which is not comparable with your node version, or wrong version of NPM, or module using another NPM module which is not installed.
The issue in your case is mongodb-core uses a module dns which is not been installed. Try to install dns with npm i dns. or remove and install mongodb-core again.

How to use New Relic with ember-cli?

right now I'm running an ember-cli application on heroku by serving it with the ember server command (not sure if this is the best method) and I'd like to integrate it with New Relic, but I have no idea how to do it.
Careful, ember server starts a live-reload server for development purposes — you edit a file, save it, and the application gets rebuild in an instant — you should not use it to serve an Ember app in production, it's a potential security risk. Normally you run ember server only on your local computer where you develop the code.
For production, build your app with ember build --environment=production, that will create a set of static files in your project's dist/ directory. You can upload these as you would upload any HTML/CSS/Javascript.
Keep in mind that Ember (and other frameworks of this kind like Angular and Backbone) is a single page application (SPA) framework; there is no server-side code at all, it all runs in the browser. Usually you would provide some sort of API (like a REST-API) on the server to provide and process data from a database or to provide other server-side services. That way you can develop the front and back-end separately.
I'm not too familiar with New Relic, but as far as I can tell it is analytics software that runs on the back-end, so it has nothing to do with your browser-side framework.
At the server folder, just find the index.js file and add require('newrelic'); at the beginning of the file. Of course you should also follow the instructions when you setup New Relic at you Heroku App, setting your application as a node.js app, which means you'll have to run npm install --save newrelic, go to your node_modules folder, find newrelic, copy newrelic.js file to the root of your application and edit the file with your app_name and license_key.
I recently removed my code from <meta ... in app/index.html and started to use this addon Ember-new-relic.
Get the JavaScript snippet.
And add it below <meta http-equiv="X-UA-Compatible"... in app/index.html.

Categories

Resources