freeCodeCamp backend code

freeCodeCamp backend code
0

#1

With jQuery instead of having the code to run jQuery in the back ground should show how to place the code in the html header to run from our own text editor…
If you do not learn this how can you build pages to upload to a server??


#2

That’s not the backend, that’s still the frontend.

But yes, that is right, if you write all your stuff on codepen, then there are a few things that aren’t clear about how to actually set up a web page.

But most of that stuff is pretty easy to learn and is readily available.

The other option is to let codepen do it for you. In in editor view, there is a button called “export”. From there you can select “export zip” and it will give you a zip that will self deploy all the properly built files.


#3

Went to codepen under js settings selected both the jQuery and kQuery UI. Neither worked on the script. Downloaded jquery-3.2.1.min.js also downoaded the css animate.css… This is what I plased in the head on html. Nothing is working for me.

jQuery Playground

#4

#5

Please provide a link to the pen and tell us exactly what you are trying to do.


#6

#7

There is a ‘JS’ panel, that’s where you put the JS, then it works.


#8

Went to the JS panel. Clicked on the settings added
https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js
and
https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js
neither worked on codepen.
Downloaded jquery-3.2.1.min.js added it to my html in my own text editor.

bootstrap works not jQuery


#10

I highly recommend what @SkyC says. However, if you insist on putting all your code in the HTML section, then remove the external links in the JS section add the script reference above your current script tags and it will work.

<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>
<script>
  $(document).ready(function () {
  $("button").addClass("animated bounce");
  });
</script>

#11

Thank you for your help…


#12

Thank you for your help


#13

As they’ve said, those script tags shouldn’t still be in the html window, they should be in your JS window as:

$(document).ready(function () {
  $("button").addClass("animated bounce");
  $("#target1").css("color", "red");
});

and then remove the first 5 lines of your html pane (the script tag).

Yes, you could put your JS in you html file if you were building this locally (or just use a script tag to link to a JS file) but that isn’t how codepen does it. And like I described above, codepen will easily convert it for you when you need to copy it to local.

Codepen isn’t perfect. But for quick and dirty stuff like your building for FCC it is great. And it makes it so easy to get help from the forum. But do things the codepen way when you’re using codepen - you’ll save yourself some hassle.