Meteor 1.0 MiniMongo not serving objects to the client side - javascript

I am working through the Discover Meteor tutorial, and even though the Posts = new Mongo.Collection('posts'); has all of its functions working on the server side Mongo shell, calling the Posts functions on the browser console is simply not working:
Posts.insert()
ReferenceError: Posts is not defined`
The collection is declared in my lib/collections folder in a posts.js file, as such:
Posts = new Mongo.Collection('posts');
if (Meteor.isServer) {
Meteor.publish('posts', function(){
return Posts.find()});
}
if(Meteor.isClient) {
Meteor.subscribe('posts');
}
`
Any ideas or suggestions? When I run db.posts.insert({title: "postname}) in the Mongo shell, the new post shows up instantly asynchronously in the browser, so I know the DB is functioning.
I'm pretty early on in the tutorial so I feel like this shouldn't be happening.

First( just to good practices), on console run this
Cd myApp
meteor remove autopublish
Now you need to Publish (server side), Subscribe(client side), all yours Collections
//server side
Posts = new Mongo.Collection('Posts');
Meteor.publish('Posts', function(){
return Posts.find()
});
/Client side
Posts = new Mongo.Collection('Posts');
Meteor.subscribe('Posts');
Hope This Works mate, and keep discovering Meteor

Are you using a web based cloud IDE?
If yes...
Do not use the javascript console that comes with your web based IDE. Run your output in a real browser like firefox or chrome and use their javascript console.

Related

Rendering react with node.js in development

I am (very) new to node.js and I am trying to get a development environment started with React.
const express = require('express')
const mongoose = require('mongoose')
const app = express()
// this displays the index.html file
app.use(express.static(__dirname + '/public'));
// trying to see the app.js
app.get('/', (req, res) => {
res.render('app')
})
app.listen(process.env.PORT || 5000);
Right now I am simply trying to be able to view my app.js when I run nodemon. But right now it is only showing the index.html file in the public folder. and when I run npm start it renders both the index.html and the app.js.
I am 100% doing something wrong and am not in my element here. Any help/advice would be appreciated.
My full repo is here for viewing here
Thank you in advance.
Your code is simply serving a static HTML file located in the public directory everytime the user make a GET request to the root (in your case, localhost:5000). It is not interacting with React yet.
Usually when starting a project with React (frontend) and Node (backend), you would create them as separate projects, in separate repositories.
So you could create a React application using a bootstrap such as create-react-app running on PORT 3000 and in another terminal tab, start your NodeJS application in PORT 5000 like in your example. Then, you can call your backend endpoint from your frontend React application, by referencing http://localhost:5000
By doing this, your backend code don't need to serve static files anymore, it can return data such as JSON and make connections to a database for example.
Since your question is not specific enough, you could be talking about server side render. In server side render apps using Node and React, you have a frontend built with React and a Node server that will return the same React code as a string, using the react-dom/server package to help. This is more complex, but basically you will have the same React code on the client AND on the server. There are performance benefits, because the user can see some content rendered right when he enters the page, without having to wait the React bundle (javascript file) to load. If you want to know more about creating a server side render app with React and Node, there is a nice digital ocean tutorial here
If you want to connect your react js project to the node js
In Development
you simply run their server and start it
In Production
You can use sendFile function coming from express.js to run the frontend
https://dev.to/loujaybee/using-create-react-app-with-express

How to connect to a Sqlite db from an HTML file via Javascript

I would like to insert data into a SQlite3 db by pressing a button from an HTML file.
In order to achieve this, I wrote a JS script.
Unfortunately, when I press the button, I get this error message in my console.log:
script.js:5 Uncaught ReferenceError: require is not defined
Then, I tried to convert my JS file with browserify but then I got this error:
Cannot read property '_handle' of undefined
Here my HTML and JS codes to reproduce the error:
HTML:
<head>
</head>
<body>
<div>
<label>SQLite3</label>
<button type="button">Connection</button>
</div>
<script src="script.js"></script>
</body>
JS:
function addData() {
const sqlite3 = require('sqlite3').verbose();
let db = new sqlite3.Database('./data.db');
db.run('INSERT INTO info (result) VALUES (10)', function(err, row) {
if(err) {
console.log(err.message);
}
console.log("entry added to table");
});
}
addData();
Browserify works around the problem that browsers don't have native support for the Node.js module system.
Browserify does not work around most other APIs that are provided but Node.js but not browsers. For example, Node.js has the fs module which allows you to access the file system of the computer the code is running on. Browsers, on the other hand, don't allow access except in very particular and limited ways.
Since new sqlite3.Database('./data.db') tries to read data from a file, it will not work in a browser.
Use a different API that is supported by browsers instead (such as IndexedDB or Web Storage.
Alternatively, if you want to share data between browsers, use Node.js to run a web server (e.g. with Express.js) and write a web service through which the database can be accessed.
You can't connect to sqlite databawe from client side you have to connect from server side language. Perhaps you can use NodeJS as server side programming language.
follow those steps then it will work
STEP1
Download and install node js from https://nodejs.org/en/download/
STEP2
Install npm by folloy this instruction
https://www.npmjs.com/get-npm
STEP3
Create Node js project by following this guides http://cassandrawilcox.me/setting-up-a-node-js-project-with-npm/
STEP4
Now you can install sqlite3 via npm.
After that you have to run server. If you are beginner then follow this
https://www.w3schools.com/nodejs/

Meteor - Meteor.Collection.get not defined in production

I'm trying to use Meteor.Collection.get(collection_name) (server side only) in production, it works well in development ; but as soon as I try to build my app with meteor --production, meteor throw
TypeError: Meteor.Collection.get is not a function
I suppose that Meteor.Collection.get was only made for debugging purposes (I can't find anything about it in the official documentation). Any idea how I can use it in production ?
I am not sure, where Meteor.Collection.get comes from in your code but I know the very reliable and long time battle proof dburles:mongo-collection-instances which allows you to retrieve a Mongo.Collection via it's name.
Add the package:
meteor add dburles:mongo-collection-instances
Create a collection:
// server/client
export const MyDocs = new Mongo.Collection('myDocs')
Get the collection:
// anywhere else
const MyDocs = Mongo.Collection.get('myDocs')
It works on the server and the client and runs fine in production.
Documentation: https://github.com/dburles/mongo-collection-instances
Edit: A note on --production
This flag is only there to simulate production minifaction. See the important message here in the docs: https://guide.meteor.com/deployment.html#never-use-production-flag
You should always use meteor build to build a production node app. More to read here: https://guide.meteor.com/deployment.html#custom-deployment

Execute NPM module through cordova

I created an app using cordova and everything is fine, expect I need to use a node module which doesn't have a client-side equivalent because I'm dealing with file write streams etc. I have found Cordova hooks to be my best shot so far, where I create an app_run hook to execute a node file that runs a socket server to listen for events from the client side.
I know, a very longwinded solution, but seems logically correct to me, the issue is that when I do create the server, building the app through Visual Studio 2017, the app launches on my android phone, but VS hangs on the "deploy" stage. I guess that it has to do with the event chain, so I created an asynchronous script like this:
(async function () {
const server = require('http').createServer()
const io = require('socket.io')(server)
io.on('connection', function (socket) {
console.log('heyo')
socket.emit('hello world', 'hi')
})
server.listen(3000, function (err) {
if (err) throw err
console.log('listening on port 3000')
})
})();
but this doesn't seem to work either, somehow VS hangs on "deploy". If anyone can possibly guide me in the right direction, that would be highly appreciated.
PS: I know the title is off, but every time I use StackOverflow to get help with a particular attempt, I'm told to do it another way, so I'll leave it open.
If the goal is to use socket.io in your cordova app, there IS a JS client for the web that you need to use and you don't need to use npm for that, just add a link to your client js file in your index file. (should be in a "client" folder when you init socket.io via npm).
<script src="/socket.io/socket.io.js"></script>
<script>
const socket = io('http://localhost');
</script>
https://socket.io/docs/client-api/

Meteor package working on browser but not on server

There's no problem using the Meteor package strikeout:string.js on the client side (browser JS console), but it throws an error when using it on the server side.
Checked package.js and found api.addFiles('lib/string.js', ['client','server']);, is this not sufficient?
Test code
console.log(S('jon').capitalize().s)
Error on server
ReferenceError: S is not defined
is this not sufficient? YES, you are getting the Reference because you are not requiring it.
In order to use it on the server, you should require it, on this example im using meteorhacks:npm.
It was not possible for me create a Meteorpad of this, so i will do here step-by-step.
First meteor add meteor hacks:npm
Second On the recent create packages.json add this line
{
"string": "3.1.0"
}
Third Now just add the server code.
if (Meteor.isServer) {
Meteor.startup(function () {
var S = Meteor.npmRequire('string'); //server side
console.log(S('jon').capitalize().s)
});
}
Expected Output
I20150326-10:54:05.639(-5)? Jon
Hope it works for you.

Categories