We Keep Coding

How can I use bootstrap javascript library without accessing Internet and local file system?

I am developing a web page with the javascript bootstrap library for UI and layout design. It will run off an Android tablet.
It may work in an offiline environment and it cannot access the local file system. It means <script src='{Url to js file}'></script> won't work.
How can it access the bootstrap css and js files? Can then be included as inline codes in the html?

CSS can be included in following ways in an HTML
Using CDN (Internet)
Using local file system(external stylesheets)
using internal stylesheets (<style>)
Placing Inline styles
Considering the above, you have only one case left, i.e. include all styles in tag and make it work. You may apply checks that internal stylesheets should work only when it's offline mode.

You can use local file:
you have tow ways to do it:
download the files and put them in your project folder and creat links/script to those files:
<script src="folderInProject/bootstrap.js"></script>
the links below contain the code :
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
simply go to the url and copy the code inside to your local js/css files:
for example go to this link and copy the code:
https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css

Google app engine python doesn't read js file

I built a python app on google app engine that pulls pictures from the flickr API and allows users to do cool stuff with the pictures, like drag and drop.
I have three JS files in the body:
<script src="js/jquery-1.11.0.min.js"></script>
<script src="js/jquery-ui-1.10.4.custom.min.js"></script>
<script src="js/init.js"></script>
My jQuery code is working fine but only when I write it in either of the jQuery documents. If I place the code in the init.js, the code simply doesn't work, which I find rather weird. I put the code in the jquery files because I wrote console logs on the three script files and only the init.js didn't print to the console. I am linking the files correctly and referring to the right folder and right file. The folder JS was also added to the app.yaml:
- url: /js
static_dir: js
I can just leave the code in the jQuery file but this is not what I am supposed to do. I want to fix it.Is there a specific way to use the JS file on google app engine?

Use absolute paths instead of relative when loading your JS files (add the leading slash /):
<script src="/js/jquery-1.11.0.min.js"></script>
<script src="/js/jquery-ui-1.10.4.custom.min.js"></script>
<script src="/js/init.js"></script>

I fixed it. The problem was that I named the file init.js. For some reason Firefox doesn't like that name (at least mine didn't) and didn't load the file. Chrome loaded the file without any problems. When I changed the file name to main.js, it started working in Firefix as well. I only tried this when I had exhausted all other possible options though. Such a weird behavior of Firefox.

How to use jQuery with Django?

I am interested in using the jQuery tablesorter but somehow am unable to.
I have followed the instructions and have placed jquery.js and the tablesorter.js in the same folder as my templates (the folder where the html file is). Unfortunately, when trying to access the .js files, it keeps hitting a 404, which I'm assuming means that the files are not on the correct path.
Any ideas for this fix?
Does django have a special place to place these js files? (not in the templates folder?)
<script type="text/javascript" src="jquery-latest.js"></script>
<script type="text/javascript" src="jquery.tablesorter.js"></script>
<script type ="text/javascript">
$(document).ready(function()
{
$("#myTable").tablesorter();
}
);
The myTable is the same exact table as the one in the examples

Usually jquery, js, css, images and most of other static contents are handled as static files and not as django templates. Read managing static files docs.

For jQuery, you can use Google API :
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
And for Django, Did you configure a path for your scripts/médias etc... ? (in settings.py maybe ?)

To add to what others have written, if you want to make JQuery available throughout your site/app and you don't like external dependencies such as Google you can do the following:
Download the latest "compressed, production" JQuery at https://jquery.com/download/ - for example, on the command line in your static directory (might be <projectname>/static): wget https://code.jquery.com/jquery-2.1.3.min.js
Add a reference to load JQuery in your site's "base" template file (might be <projectname>/<appname>/templates/base.html) - for example: Add <script src="{% static 'jquery-2.1.3.min.js' %}"></script> in the <head> section
Test the JQuery installation by adding something like the following to one of your templates:
<script type="text/javascript">
$(document).ready(
function(){
$("#jqtest").html("JQuery installed successfully!");
}
);
</script>
<p id="jqtest"></p>
If necessary/usual after making template updates, restart your Django server, then load a page which uses the template with the test code

Sharing JS files across multiple Apps (for local and production)

Say I have the following structure for 3 different apps that live on 3 different domains, and a personal "cdn" where I can put files that are common across all three apps:
root/
/dinosaureggs.com
/magicalapples.com
/wizardsupplies.com
/mypersonalcdn.com
/js
/php
/css
This same structure is mirrored on a local and production environment.
If I'm in dinosaureggs.com and I want to use a shared PHP library in the /php folder I can say:
require('/../mypersonalcdn.com/php/library.php')
This works fine on both the local and production servers.
However, it won't work for JS because JS includes can't back out of the "app" with paths the same way PHP can.
I can't say:
<script type="text/javascript" src="/../mypersonal.cdn/js/library.js"></script>
Now, on live I could say:
<script type="text/javascript" src="http://mypersonalcdn.com/js/menus.js"></script>
But this doesn't solve my problem for local environment (at least to the extent that I wish to leave it truly locally and have the option to develop offline).
Any suggestions?

Each app has to provide it's own copy of the JS library, either that or put them in your CDN.
You can't go up from your webroot because there is nothing there, so make sure it's available within your webroot, either because it's there or by a rewrite that forwards the request to a PHP script that will find the JS file and return it's contents.

For local devopment, why can't you just use the html file scheme for src paramaters.
For example, (I'm making up the directory where your root folder is located here, change it)
<script type="text/javascript" src="file://Users/bob/projects/root/mypersonalcdn.com/js/menus.js"></script>

You can modify your php file like this:
<?php if ($_SERVER['SERVER_NAME'] == "localhost") { ?>
<script type="text/javascript" src="path/to/your/library.js"></script>
<?php } else { ?>
<script type="text/javascript" src="http://mypersonalcdn.com/js/menus.js"></script>
<?php } ?>
It's a common way to deal with such problems.

While the PHP to fetch JS method above was ok, this was a much more straightforward solution that I eventually landed on:
Serving files outside of doc root / having common client files across multiple domains
To do this you set a mod_alias in http.conf
On local environment that looked like this:
Alias /shared/ "/Users/Jane Doe/Sites/shared"
<Directory "/Users/Jane Doe/Sites/shared">
Options Indexes MultiViews
Order allow,deny
Allow from all
</Directory>
This makes it so you can call a css (or image or js or whatever) like this:
But instead of looking in /shared/ on that domain, it'd go to wherever on the server you had "shared" pointed to; in this case: /Users/Jane Doe/Sites/shared/
Resources:
Serving images from outside of document root
http://httpd.apache.org/docs/2.0/mod/mod_alias.html#alias

Adding Jquery to root folder in my server (localhost)

I am learning web development and I have no idea where to place jquery.js file on my localhost server. Do I just save it as such /var/www/jquery.js and then reference it with:
<script type="text/javascript" src="jquery.js">?
Will that work or is there a particular place that is called a root folder on localhost server that I don't know about...Sorry for how dumb this sounds..

Just put it anywhere, and include a <script> tag that embeds it, e.g. <script type="text/javascript" src="/some/location/in/my/webroot/jquery.js"></script>.

bob,
Its always good to maintain nice heirarcy structure
do as below
Create a separate folder for js , which is javascript and place all of them there
root/js/jquery.js
and you can include
/js/jquery.js
This should be good
either you can include from google cdn also , so that you can have better performance
http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js
reference here
http://softwareas.com/google-jquery-cdn

You can place it anywhere you want as long as the includes contains the proper path.
If you place it here:
/www/ajax/jquery.js
Your includes would look like this:
<script type="text/javascript" src="/ajax/jquery.js"></script>
BTW: /www/ is your "web root"
EDIT:
I'd also place my JavaScript includes and scripts at the end of my body section...
Click here to read about script location and performance.