1. Code Editing
Lesson 2

2. Learning Objectives The learning objectives for this lesson are:
Identify code editors that work best for Web development
Compare cross-platform code editors
Analyze the Brackets code editor
Develop a code editing environment by installing the Brackets code editor and extensions related to HTML and CSS code
Create a screencast that shows your editor, the extensions that are installed, and how the editor is used to write HTML and CSS code.
2/11/2017
Lesson 2, Code Editing

3. Resources Use these resources to achieve the learning objectives:
Wikipedia page on "Comparison of Text Editors"
Web search for plain text, non-IDE, cross-platform code editors
Brackets – Get Brackets from their website
Brackets extensions – These are installed from within Brackets after you have it installed
My Brackets playlist on YouTube
Screencast-o-Matic – for getting help when you have trouble
WBU Online Library
2/11/2017
Lesson 2, Code Editing

4. Terminology
You need to understand the following terms for this lesson:
Code editor
Code editors are computer applications (like Brackets) that enable the user to write code for computers in a variety of computer languages. The only languages that are important for this class are HTML, CSS, and JavaScript.
WYSIWYG
"What you see is what you get" (WYSIWYG) editors are full-featured, Integrated Development Environment (IDE) code editors that enable Web developers to build websites without having to know all the details of the code being used. WYSIWYG editors may not be used in this class. (Example: Dreamweaver)
2/11/2017
Lesson 2, Code Editing

5. Terminology Terminology (continued) Plain text File extension
"Plain text" describes code that is both meaningful to a computer as well as being readable by a human. Coding languages like HTML, CSS, and JavaScript are simply plain text files that are saved with a special file extension.
File extension
A "file extension" is a short string of characters that follows the last period after a file name. The purpose of a file extension is to tell the computer what program to use to run that file. (Example: index.html)
2/11/2017
Lesson 2, Code Editing

6. 2/11/2017
Lesson 2, Code Editing

7. Terminology Terminology (continued) Cross-platform Screencast
Refers to a computer application that runs about the same on Windows, Mac, Linux, or other computer operating systems.
Screencast
A screencast is an audio and video creation of something occurring on your computer screen. (Examples: Screencast-o-Matic for PCs, QuickTime Player for Mac)
Screencasts are much better than simple screen shots.
Using a microphone, you are able to both describe and show what is happening on your computer and share this with another person so he/she can understand the full context of a problem or question.
2/11/2017
Lesson 2, Code Editing

8. 2/11/2017
Lesson 2, Code Editing

9. Collaboration There are two discussion forums for this lesson:
Due by Wednesday night at midnight
Do some research using the suggested resources and compare three free, cross-platform, non-IDE code editors. The length of your posting should be about words. Be sure to cite your sources. Post 2 messages.
(Learning objectives 1, 2, & 3)
Due by Sunday night at midnight
Peer-to-Peer Support. Support and learn from one another by posting questions about problems and solutions you have with this week's lesson.
2/11/2017
Lesson 2, Code Editing

10. Test Due by Sunday night at midnight.
Use the link found in Blackboard to take the test for this lesson.
2/11/2017
Lesson 2, Code Editing