Student Website Setup

Transcription

1 In this course, students upload assignments to their websites hosted on the coislinux.austincc.edu server in addition to submitting to Blackboard (Bb). Each student is supplied with a password protected account to access their individual websites. Sample account credentials are supplied in Figure 1. Access your Website Credentials in Bb via My Grades & Due Dates Website Credentials and simply click the graphic. The user name is in yellow and the password is in blue. The user name and password are used to access your site in two ways. First, files and directories are uploaded and maintained on the site via an SSH client (e.g. WinSCP, CoreFTP, FileZilla, Expression Web). Second, sites are viewed via a browser. Again, username and password credentials are required for both uploading and viewing. (Note: the user name is the same for your ACC lab account with no u.) In Figure 1, the ssh client line is used to access the site for upload of files and directories. Instructions for using Expression Web are provided below. The http browser line is placed in the URL box of a browser to view the site. Note the tilde ~ and u in the URL data. Figure 1 The steps to setup your student website are listed below. There are a number of ways to accomplish site setup. However, as with any set of progressive computer directions, it is imperative that the instructions be implemented correctly are depicted. Take your time, the steps can be performed in ~20 minutes. If you really want to reinforce your understanding of the concepts (which you should if you are considering becoming a professional web developer), delete your work locally and remotely after completing the steps. Then, complete the steps again and repeat 3-5 times. You should then be comfortable with the essential processes contained herein. Page 1 of 19

2 1. Open Windows Explorer and navigate to your C:\ directory. 2. Right-click in Explorer and select New Folder. 3. Name the folder yourlastname_mysites Page 2 of 19

3 4. Double-click to open yourlastname_mysites and create the 3 folders listed below contained within the yourlastname_mysites folder. 5. Now that we have the site structure built we are ready to create 4 sites in Expression Web. The 4 sites will be: a. yourlastname_mywebsites b. connectup c. finalproject d. tradewinds 6. Open Expression Web (EW) and select Site New Site. Page 3 of 19

4 7. The New site window opens. Click Browse and select the C:\yourlastname_mysites folder as make the settings as shown. Page 4 of 19

5 8. After selecting OK your Folder List and Site View should be like the next figure: The folders are just folders at this point. Our next step will be to transform them into sites. 9. Repeat the new site creation steps 3 more times for the connectup, finalproject and tradewinds sites. Page 5 of 19

6 10. After creating the remaining 3 sites, close EW and reopen it. The folders should now appear as individual sites (folder with the world icon). 11. In Blackboard (Bb), navigate to Resources, click on default-top-level.html to download/save it. Rename it to default.html and save it to your top-level site which is C:\yourlastname_mysites. 12. IMPORTANT: The default.html output is depicted below. Your top-level page (default.html) should appear like the example below (with your name of course). When the ConnectUP and TradeWinds links are selected, the appropriate ConnectUP and TraeWinds default.html page should be displayed which lists the links for Unit B Unit P (no need to upload Unit A to your site just submit a screen capture of Unit A to Bb). Page 6 of 19

7 13. Open Expression Web Site Open Site and select yourname_mysites to open. Double-click on default.html to open it and make the changes highlighted. Save your changes. 14. Close EW. Restart EW and open the Tradewinds site. Download a copy of default_tradewinds.html from Bb Resources (see below) to the tradewinds folder. Page 7 of 19

8 15. The output of default_tradewinds.html is depicted below. 16. Open default_tradewinds.html in EW to see the following. Add <a> elements for the missing units (B-O). Page 8 of 19

9 17. After modifications, your output of default_tradewinds.html should look like that below with the units in for the elipses ( ). Change the name of the file to default.html. Now, you need to create the folders required for your sites and place copies of the this new default.html in each of the folders (unit_a unit_p) for both TradeWinds and ConnectUp. 18. Select the Site View tab, right-click in the area below, and select New Folder. Name the folder unit_a. Page 9 of 19

10 19. Right-click on default.html Copy then paste it in the unit_a folder. Open that default.html and modify it so it can be recognized as being in Tradewinds, unit_a. The unit_a folder is only for testing. There is no need to create the remaining folders (unit_b unit_p) since those directories will be inserted when each of the unit_b through unit_p sites are published. That is, each unit_b-p directory will be a site (more on this below). Page 10 of 19

11 20. As you progress through the ConnectUp assignments (Independent Challenge #1 in each of the units) you will create a site for each unit and with the appropriate name. For instance, for the ConnectUp assignment in Unit B, create a new site and the site path would look like the following in EW: I recommend unchecking the Add to Managed List below to keep your Managed Sites list smaller. If you prefer to have all sites listed, check this box. Page 11 of 19

12 21. After performing the step above, open the connectup site and you will notice the unit_b site has been added. 22. IMPORTANT: Your ConnectUp site default.html page should look like that below (without Unit A). In EW, select Site Open Site connectup. Open default.html and modify it to look like the output below. Each of the units will be a self-contained site that you publish as you work through the EW textbook. 23. We are now ready to publish the sites. Publishing means uploading files and folders to a web server so the website can be accessed via the WWW. Publication can be performed with a dedicated program like WinSCP or FileZilla. In this guide, we will use Expression Web to upload our sites. Page 12 of 19

13 24. Open EW and open the site yourlastname_mysites. You should see the same view as that below. 25. Select Site Publishing or Publishing at the bottom of the window. OR 26. Then select Add a publishing destination from the middle of the page. Page 13 of 19

14 27. Make the following settings in the Connection Settings dialog box. Be sure to leave the password blank on public computers. Note: Your username will vary from that in the screen shots that follow. For instance, using the website credentials in Figure 1 on p. 1, the user name would be: u instead of the L depicted. For the following screen shots, use your personalized user name and password combination shown in your website credentials in Bb. Page 14 of 19

15 28. The Connect to cois-linux.austincc.edu dialog box appears. Enter your password here and deselect the Remember my password checkbox on public computers. Select OK. 29. Notice the do not enter signs beside the site folders. By default, each site is intended to have its own publication connection. However, for our purposes, we want to publish via our master site (yourlastname_mysites). Change the setting in the next step to Include subsites. Page 15 of 19

16 30. Select Site Publishing Settings to see the Site Settings dialog box below. Check the box Include subsites. Select OK. 31. The do not enter signs disappear and we are ready to upload the 3 folders and 1 file to our student website. Page 16 of 19

17 32. Shift-select all 4 items on the left (local computer) and click the upload arrow. Be very careful to only upload content and never download from a Production site. That way, you will never make the common mistake of overwriting local content with site content. Also, do not modify system files like.htaccess. 33. Congratulations! All of your sites are published. See the remote directory view below. It shows the student website content. However, not done yet. We must the sites via a browser to ensure proper operations. Always test your work after uploading to Production servers. Page 17 of 19

18 34. Open a browser and navigate to your site: 35. Enter your user name and password. Deselect Remember my credentials on public computers. If you select that option on a public computer, other users will be able to access your site. On your own machines however, this option can be used to make accessing your site more efficient. You should also save a bookmark in your browser to your home site (yournamehere_mysites) so you can easily access your work for testing after publication. Page 18 of 19

19 36. your site (including links). Now you are ready to begin. 37. Side Note: Publishing from the master site like described above is one approach. After working with EW, you may elect to create Publishing Settings that point directly to your ConnectUp and Final Project sites. To accomplish that, create new Connection Settings and ensure the directories point to the correct location. For instance, to point and publish directly to ConnectUp, in the Connection Settings dialog box, change to Directory: public_html/connectup. You will now be pointing to your published ConnectUp site. Optional but vigorously recommended Delete all work and start again. Repeat the steps until you can perform them from memory. That may seem like a formidable challenge but you will likely pleasantly surprise yourself. Page 19 of 19