{"id":3995,"date":"2023-08-22T18:28:16","date_gmt":"2023-08-22T18:28:16","guid":{"rendered":"https:\/\/nmi.cool\/advweb\/?page_id=3995"},"modified":"2023-08-22T18:28:16","modified_gmt":"2023-08-22T18:28:16","slug":"uploading-to-the-server","status":"publish","type":"page","link":"https:\/\/nmi.cool\/advweb\/uploading-to-the-server\/","title":{"rendered":"Uploading to the server"},"content":{"rendered":"\n<p><em>Before we dive deep into the fun stuff (making websites), it\u2019s important we understand a few key concepts. By the end of this lesson, you will be familiar with servers and uploading to the server.<\/em><\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Saving things \u201clocally\u201d versus on the&nbsp;<\/strong>server<\/h2>\n\n\n\n<p>When you save files, images, etc. on your computer or to your Dropbox account, you are the only one who has access to those files. You must be able to login to that particular computer or Dropbox account to access to those files.<\/p>\n\n\n\n<p>In your personal life, when you shared files with your friends and family, you probably created a shared link in your Google Drive, sent them an email attachment, or Air Drop\u2019ed them a file.<strong>&nbsp;For websites, the file sharing process works a little differently.<\/strong><br><br>Throughout the course of the semester, you will be creating webpages. The only way you can share these files (files here referring to webpages, which are just fancy files) is to&nbsp;<strong>upload them to a server<\/strong>.<\/p>\n\n\n\n<p>When you save a file on your computer, you\u2019re basically saving it locally\u2014think about putting a leftover slice of Automatic pizza in your personal fridge at home. Can you access that leftover pizza from your friend\u2019s fridge in her apartment on the other side of town? Nope. Now, if you uploaded that (hypothetical) pizza to the server, you could access it wherever you wanted.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>What\u2019s a server?<\/strong><\/h2>\n\n\n\n<p>A server is a computer designed to store web files. Servers are computers, but they\u2019re huge, high-powered computing machines; think of the server as the mitochondria of computers (in other words, the powerhouse of computers). This isn\u2019t your grandma\u2019s Macbook.&nbsp;<\/p>\n\n\n\n<p>The server\u2014this massive, behemoth computer machine\u2014doesn\u2019t just store files. It pushes and pulls data from the Internet. When we type in a URL, such as&nbsp;<a href=\"https:\/\/www.uga.edu\/\">https:\/\/www.uga.edu\/<\/a>, the server looks for that particular file (because webpages are just fancy files!) and pushes it back to us.<br><br>Your desktop is to you, as the server is to your website. If you\u2019re the only one that needs to see cutedog392084.jpg, you keep that file on your computer. If you need the world to see cutedog392084.jpg, you upload it to the server.<br><br>Also, if you\u2019d like to pass this class, for your teacher to grade your work, it must be on the server. I will not grade email attachments. To turn in your work, you\u2019ll be putting it on your website.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>How do I put files on the server?<\/strong><\/h2>\n\n\n\n<p>That\u2019s a good question! That\u2019s where our FTP (File Transfer Protocol) client comes in handy. With an FTP client (in our case, we\u2019re using one called Cyberduck, although there are hundreds) we can login to the server that houses our website. We can exchange files and organize the file structure. The FTP client gives us a window into the server. It\u2019s basically the way we upload and save files to our websites. Once a file is in the server, you can access it online.<\/p>\n\n\n\n<p><strong>Take note:<\/strong>&nbsp;once a file is in the server, and you make a change to that file, you have to save it&nbsp;<strong>back&nbsp;<\/strong>to the server.<\/p>\n\n\n\n<p>In other words, an FTP client (again, Cyberduck), is the&nbsp;<em>application&nbsp;<\/em>we use to access the server. We login with a certain set of credentials, and we\u2019re able to see all the files saved on the server. It is our window to the server. Repeat:&nbsp;<strong>the FTP client is our window to the server.<br><\/strong><br>The server is the file structure of our websites. The FTP client (Cyberduck) is how we access and organize those file structures.<\/p>\n\n\n\n<p>When you\u2019re told to upload a file called index.html to your website, that means you need to drag index.html from your Dropbox (assuming you are saving it there) into your server. How? Through the FTP client (Cyberduck).<\/p>\n\n\n\n<p>If you\u2019re told \u201cFTP it\u201d that means the same thing as uploading; put it on your website. Which means\u2014put it on the server. Which means\u2014open Cyberduck, and drag that file into the server.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>How to upload<\/strong><\/h2>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Save your file to Dropbox<\/li>\n\n\n\n<li>Drag file from Dropbox to Cyberduck<\/li>\n\n\n\n<li>Double-check you saved it in the&nbsp;<strong>right&nbsp;<\/strong>location\u2014is it in the folder it should be in?<\/li>\n\n\n\n<li>Navigate to your website. Can you access that file? If not, you probably FTP\u2019d it in the wrong place. Repeat Step<\/li>\n<\/ol>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"troubleshooting\">Troubleshooting<\/h3>\n\n\n\n<p>If you\u2019ve tried uploading your files to your server but it isn\u2019t working there are several common mistakes that might be giving you trouble.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Make sure you are looking for your file in the right place!<\/strong>&nbsp;For example, if you want to see if project one uploaded successfully you\u2019ll want to make sure that you\u2019re typing in the correct URL:<\/li>\n<\/ul>\n\n\n\n<p><code>yoursite.com\/nmc\/web\/project-one<\/code><\/p>\n\n\n\n<p><code>yoursite.com\/em\/web\/project-one<\/code><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Caching!<\/strong>&nbsp;Try a hard reload to see if you\u2019re having a caching problem. Check out this&nbsp;<a href=\"https:\/\/nmi.cool\/web\/caching\/\" target=\"_blank\" rel=\"noreferrer noopener\">caching lesson<\/a>&nbsp;for instructions.<\/li>\n\n\n\n<li><strong>File path errors<\/strong>&nbsp;can cause a lot of trouble. Double check that your file paths in Dropbox and on the server are identical. Also, make sure your homepages are named index.html. Need a refresher: check out this lesson on&nbsp;<a href=\"https:\/\/nmi.cool\/web\/indexes-and-directories\/\" target=\"_blank\" rel=\"noreferrer noopener\">homepages and the course file structure<\/a>.<\/li>\n\n\n\n<li>Still not working? Make sure that your&nbsp;<strong>files and folders are named consistently<\/strong>&nbsp;and following best practices. A small mistake with capitalization or spacing can lead to a lot of frustration. Check out this lesson on&nbsp;<a href=\"https:\/\/nmi.cool\/web\/files-folders#naming\" target=\"_blank\" rel=\"noreferrer noopener\">file and folder names<\/a>&nbsp;and double check your work carefully.<\/li>\n\n\n\n<li>If, after trying all of the above tips, you are still having a problem it\u2019s time to call in reinforcements. Check out this resource for the most efficient ways to&nbsp;<a href=\"https:\/\/nmi.cool\/web\/help-help\/\" target=\"_blank\" rel=\"noreferrer noopener\">ask for help<\/a>.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Resources:<\/h2>\n\n\n\n<p>Read more on FTP\u2019ing: this&nbsp;<a href=\"https:\/\/www.wired.com\/2010\/02\/ftp_for_beginners\/\">article<\/a>&nbsp;by Wired.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Before we dive deep into the fun stuff (making websites), it\u2019s important we understand a few key concepts. By the end of this lesson, you will be familiar with servers and uploading to the server. Saving things \u201clocally\u201d versus on the&nbsp;server When you save files, images, etc. on your computer or to your Dropbox account, &hellip; <a href=\"https:\/\/nmi.cool\/advweb\/uploading-to-the-server\/\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Uploading to the server<\/span><\/a><\/p>\n","protected":false},"author":17,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-3995","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/nmi.cool\/advweb\/wp-json\/wp\/v2\/pages\/3995","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nmi.cool\/advweb\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/nmi.cool\/advweb\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/nmi.cool\/advweb\/wp-json\/wp\/v2\/users\/17"}],"replies":[{"embeddable":true,"href":"https:\/\/nmi.cool\/advweb\/wp-json\/wp\/v2\/comments?post=3995"}],"version-history":[{"count":1,"href":"https:\/\/nmi.cool\/advweb\/wp-json\/wp\/v2\/pages\/3995\/revisions"}],"predecessor-version":[{"id":3998,"href":"https:\/\/nmi.cool\/advweb\/wp-json\/wp\/v2\/pages\/3995\/revisions\/3998"}],"wp:attachment":[{"href":"https:\/\/nmi.cool\/advweb\/wp-json\/wp\/v2\/media?parent=3995"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}