I'm sorry if this doesn't count as a "Programming Question" but I found it relevant since this will make me able to do programming in the Podio API.
My question/problem is that I can't figure out the correct way to set up the Podio JavaScript SDK/API scripts. I followed "http://podio.github.io/podio-js/" but it really only explains so much.. Mostly about Node and that I need to use Node for it, but isn't there another way like simple Ajax calls?
Reason being, I don't have the possibility of running a Node server in my server background, just to make API calls, it may be effective but it sounds kind of stupid when so many other API's out there doesn't require this.
Thoughts?
podio-js is a Podio JavaScript SDK for node and the browser.
... which means you don't necessary need Node.js. To use NPM module in the browser you'll need a bundler, like Webpack:
npm install podio-js --save
npm install webpack --save-dev
Then in your app.js:
var podio = require('podio-js');
// follow the tutorial
To bundle the app:
./node_modules/.bin/webpack app.js app.bundle.js
Then include the bundle in your HTML via script tag and voilà:
<script src="app.bundle.js"></script>
Related
I am pretty new to js. And I am looking to learn js. Recently I came across one library called bounce.js which is animation library. Which require NPM to install but why? I am dont want to use NPM (or any packet Manager) they havent provided min.js file to direct import in scrpit tag?? Why??. Similarly for Tailwind it require NPM. And as NPM require it means I need vercel to deploy and all stuff.
2) As I use django I dont know how to install NPM modules in my templates.
Please help me clear out from this mess.
When all I can find is NPM based installation guides I like to search the library name followed by CDN which typically brings up some minified results. In your case I tried searching for bounce.js CDN which brought up lots of results including this one:
https://cdnjs.com/libraries/bounce.js/0.8.2
which points to
https://cdnjs.cloudflare.com/ajax/libs/bounce.js/0.8.2/bounce.min.js
You should be able to do some searching and find the CDN you wish to use. If you want the source JS to serve from your own server you can visit the .js link and right click and download (or copy and paste into your own file).
One of the advantages of using npm over a direct download is facilitating the integration into your workflow.
For instance, if you use a module bundler, the bundler will generate an "optimised", minified version for you: Getting rid of unused code for you (=> Tree shaking) reducing the size of your resulting code, solving some import issues, and more
NPM will also help you keep track of your imported library. You know if you use an up-to-date or outdated version. It will also inform you about
Eventual securities issues. And much more.
There are many, many advantages of using npm over direct download.
Potential similar question here.
I'd like to build a simple in-browser app that can run without an internet connection.
To develop a Python project, this isn't even a question. You just pip install whatever in your favorite virtual env and run offline all day. Your dependency list is also managed for you locally.
While building a toy project with npm, I can't figure out how to do the above. Parcel seems like a good tool to build, bundle, minify, etc. But in the end, all dependencies still point to a CDN. I understand this is default behavior, but there seems no way to easily pull all dependencies local and run offline.
Not a web dev so if I'm asking the wrong question, that sort of insight is appreciated also.
Edit: I've already built all the functionality I need. I can run successfully from file:// or a simple http server. What I'm trying to do in consolidate all the dependencies locally so as to not depend on a CDN at runtime. It'd be better to not go to each CDN/GitHub repo, manually download JS/CSS dependencies, and then manually link to them from my code. That's the point of using a bundler or similar. Is Electron or another framework really the best way to do this? For my use that feels like a lot of overhead.
You can use npm to install and maintain your dependencies. Lets say you are create your project from start. You will need to do the following steps. Assuming you have npm installed.
mkdir my-project //create project directory
cd my-project // cd into project direcotry
npm init // init npm project inside the directory.
After this you can install javascript packages using npm i package-name
Right now I am following a Mojs tutorial, and, having played a little bit with it, I figured out that installing and uninstalling Mojs through npm install and npm uninstall, respectively, doesn't make any difference - if I have a hyperlink
<script src="http://cdn.jsdelivr.net/mojs/latest/mo.min.js"></script>
in my html file, the script works, if I remove it - it stops,no matter if I have Mojs installed through npm. How to make any sense of it?
Node is just a javascript runtime. You use it to run Javascript code outside of the browser. It doesn't automatically put any script files in your html. Node Package Manager (npm) is a helpful tool for getting packages and modules, such as Mojs, but they have to be 'required' in a seperate js file either by using require or import
If you've ever used Python, think of Node as Python and npm as pip where you have to run pip install before you can 'import' the module.
Using node you can run any js file by typing node file.js similar to how you would run a python script using python file.js.
When you install a package using npm install a node_modules directory is created and a whole bunch of (usually) javascript files are installed there under a folder of the name of the module, so if you want to manually include the files, you should look there to find it.
I suggest this introduction to Nodejs.
The script tag that you posted is using a url to a cdn (content delivery network (I think)). This means that when it tries to load the script tag, it looks at the url, then fetches the data from the cdn server and returns it to the browser.
The files you are installing via npm are generally not available to your front-end code unless you are using something like webpack or browserify. They will bundle all of the files you are using from node and allow them to be available in the browser.
So, yes, it does make sense that you installing or uninstalling that package is not affecting the app.
I've been trying to use a npm module called solc in AngularJs but I can't seem to succeed in anyway.
I know it's meant to be used with a Node application but I was wondering if there is a way to use it client side.
I've been trying to use Require.js and require every file included inside the git-repo but there are too many dependencies so I was wondering if there is another way.
I've been looking at browserify but that doesn't seems to do exactly what I need.
Does anyone have any idea?
You can use a npm package in browser applications if the package does not have any dependency on Node's built-in APIs. That's because Node APIs are available on server side and not on browser.
If you see here and here in the github repo of solc, you will see that it requires Node's built-in modules path and https. So it will not work in any browser application.
I'm trying to follow this page https://github.com/feross/simple-peer
1) Install npm simple-peer (check)
2) create an html page: bundle.js is missing?
3) the next code window doesn't indicate what it is at all.
Is it the JS for the html file, or the code in node. no idea.. as browserify (if I understand correctly) allows you to use require() in the browser...
Can someone clarify?
The document given is a little incomplete and assumes you have knowledge of module bundling, which many people dont. Anyways, to get this working, you would have to use a module bundler (like browserify or webpack).
To get started, consider bootstrapping your app using this yeoman generator.
After bootstrapping your app, add the script given in the above documentation in the source file (in src/index.js), after installing dependancies with npm install
Run npm start
Open localhost:8080 and you should see the result you want.
bundle.js which is mentioned the the above module is the resultant javascript file after all node modules have been bundled into one browser compatible file.