I am developing my first web app for learning purposes. It consists on a calendar wher you can add tasks, edit, and remove them asynchronously. Simple.
Everything seemed to work fine but once I uploaded it to my hosting, one friend reported me he can´t see the calendar, only the header and the footer... he says it happens on all browsers, but that on the smartphone it works fine... I checked myself and I can see it fine on all my browsers (that´s why I have not noticed), but happens the same bug on smartphone! It is just the same problem my friend had, but on the opposite device.
I contacted the hosting, and changed the PHP version to the most similar I had on the XAMPP I used to develop it... (5.6.32 on xampp and 5.6.35 on the hosting), but the problem still goes on.
I also tried to update bootstrap version. Calendar is done with bootstrap, JS (with some ES6 features like importing-exporting modules) and jquery returning data through PHP from a database... nothing special.
Do you know what could be happening? To see the calendar you must be logged.
If you want to log and see it, use these fake credentials:
email: test@gmail.com pass: 12345678
and this is the link
http://myreminder.avanzartewebs.com/
I will put the head tag of the problematic file to see if it can give you a hint
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js" defer></script>
<!-- Latest compiled and minified CSS -->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js" integrity="sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm" crossorigin="anonymous" defer></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.bundle.min.js" integrity="sha384-lZmvU/TzxoIQIOD9yQDEpvxp6wEU32Fy0ckUgOH4EIlMOCdR823rg4+3gWRwnX1M" crossorigin="anonymous" defer></script>
<link rel="stylesheet" type="text/css" href="../assets/css/styles.css">
<script src="getAndPrintDate.js" defer></script>
<!--<script src="assets/js/crearCalendario.js" defer></script>-->
<script src="view_crearAnioCompleto.js" type="module"></script>
<!--<script src="assets/js/buildList.js" defer></script>-->
<!--the scripts with type=module (which work with modules using the imports) are defer by default-->
<script src="../controls/clickOnCell.js" type ="module" ></script>
<script src="../controls/taskSubmit.js" type ="module" ></script>
<script src="../controls/listButtonsClick.js" defer ></script>
<script src="../controls/editTaskSubmit.js" type="module" ></script>
<script src="../assets/js/fontawesome-all.js" defer ></script>
</head>
