Download Introduction to CSC110

Survey
yes no Was this document useful for you?
   Thank you for your participation!

* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project

Document related concepts

URL redirection wikipedia , lookup

Transcript
CSW 131
Free MS Software (MSDNAA)
MS Visual Web Developer
W3 / Mozilla Code Validators
Uploading Your Website
Summer 2013
Prepared by Prof. B.
INDEX
1
Download & Install
 Visual Web Developer (VWD) is a web page and site
development and management environment,
enabling easy uploads to WCU’s server.
 Just ONE of Microsoft’s program that are similar to Adobe
Dreamweaver
 FREE Microsoft programs available to WCU students
currently enrolled in at least one computer science course
 This program is loaded on the UNA 141 PCs
 Optional: link to download VWD for use on your own
PC is on the class website “Hot!” page and slide 9.
 This program requires a Windows OS
 If you choose to keep it, you must register the
product (free)
Back to Summary (and Index)
2
Starting the Program & Opening a Web Site
 Select Start | All Programs | Microsoft Visual Web
Developer 2010 Express Edition
 Insert your flash drive
 Click File | Open Web Site…
 Click Class_work folder in your flash drive | Open
Back to Summary (and Index)
3
Working with a Web Page in a Web Site
 In Solution Explorer open index.html within ch05 in your Class_work
folder
 To show line numbers:
 click Tools | Options | General, check Line numbers, then click OK
 Note the color coding: some examples are:
 <tags>
 selector {
property: value;
 notation / comments
 general text
 At the bottom of the VWD screen, click:
 Split to see both code & WYSIWYG
 Design for WYSIWIG view only
 An approximation only; testing is still needed!
 Source for code only
 Try the buttons at the bottom of the screen
Back to Summary (and Index)
4
Adding a New Web Page in a Web Site
 Within Class_work, Chapter 05, click File | New File…
 From Add New Item window select HTML Page, name it test.htm (or
test.html – be consistent), then click Add
OR
Right-click the top level under Solution Explorer, and select Add New
Item, then select HTML page
 Notice the new page has been added to your folder and the default
Source code to start has been inserted.
 Experiment with this file
 When done you can delete it within Solution Explorer
 Right click test.htm (or test.html)
 Click Delete
 Click OK
Back to Summary (and Index)
5
Creating a New Web Site
 Create a folder on your flash drive for websites, e.g.,
csw131\websites
 From within VWD program click File | New Web Site…
 From New Web Site window, with Visual Basic
highlighted under Installed Templates, select ASP.NET
Empty Web Site, name it TestWeb on your flash drive,
e.g.,
CSW131\Websites\TestWeb
then click OK
 You can add new web pages per the previous slide and
delete web.config, which is not needed.
Back to Summary (and Index)
6
Validating Your Code
 With Mozilla, w3.org has a number a free tools. We can check our
web pages for proper (X)HTML code at:
 http://validator.w3.org/
And check for proper CSS code at:
 http://jigsaw.w3.org/css-validator/
 Go to the 1st link, click the By file upload tab, use the Browse… to
select index.html from index.html within ch05 in your Class_work
folder, then click the Check button.
 Errors and warnings (if any) will appear. Use VWD to edit line 2:
<html xmlns="http://www.w3.org/1999/xhtml"> and on a
new line after </title> type <meta http-equiv="Content-Type"
content="text/html; charset=utf-8" />, save and recheck.
 Next try the 2nd link for both index.html and styles.css within ch05 in
your Class_work folder. Selecting and checking files works as above.
 Again, errors and warnings (if any) will appear and you can make
any needed changes within VWD, Save, then Check again.
 Note: Using UTF-8 encoding “internationalizes” your website.
Back to Summary (and Index)
7
Copying a Web Site to Your WCU Server Location
 Within VWD, and E:\csw131\project\
(your web site open), in Solution Explorer
(top right of screen), click Copy Web Site icon
1. Click the Connect icon
2. Click the FTP Site icon
3. Server: ftp://fl123456@
roadrunner.cs.wcupa.edu/
e.g., fl is for Fran Lowe followed
by a WCU student ID number
1
4. Username: fl123456
5. Password: fl123456 (may need
2
to be entered twice)
 Click Open button and MAKE
SURE html_public is selected on right
 Highlight files & folders to upload
on left side of screen
 Click right arrow symbol
and
pages are uploaded
3
4
5
 See web site online: http://roadrunner.cs.wcupa.edu/~fl123456
 Note: These uploads may ONLY be done WHEN ON CAMPUS!
Note2: Create uploading.txt with your server & URL information; Now!
Back to Summary (and Index)
8
Summary (and Index)
 WCU CSC students can get free MS software (slide 2).
 VWD is a web page and site development and management
environment, enabling easy uploads to WCU’s server (slide 2).
 VWD is loaded on UNA 141 PCs, is easy to use (slide 3),
and can be downloaded free for use on any Windows PC.
 Coding is color keyed (slide 4)
 Three coding environments (slide 4) are:
 Source (code only)
 Design (WYSIWYG)
 Split (both code & WYSIWYG)
WYSIWYG is an estimated appearance: always test!
 Creating new web pages (slide 5) or websites (slide 6).
 Validate your XHTML & CSS with W3.org tools (slide 7).
 Uploads to WCU’s server are easy (slide 8), but may only be
available when on campus.
9