knowledge-kitchen
/
course-notes
class: center, middle # Welcome Web Design & Computer Principles --- # Agenda 1. [Introductions](#introductions) 2. [What is involved](#involves) 3. [How this course works](#how-course-works) 4. [What to do now](#do-now) 5. [Conclusions](#conclusions) --- name: introductions # Introductions -- name: main-links ## This course Introduction to Web Design & Computer Principles - [Syllabus](/content/courses/web-design/syllabus/) - [Schedule](/content/courses/web-design/schedule/) --- template: introductions Official description: > Introduces students to both the practice of web design and the basic principles of computer science. The practice component covers not only web design but also current graphics and software tools. The principles section includes an overview of hardware and software, the history of computers, and a discussion of the impact of computers and the Internet. --- template: introductions ## Me Foo Barstein - discord: @foo.barstein --- template: introductions ## You - Probably an aspiring content producer. -- - Perhaps a designer. -- - Perhaps even an aspiring computer scientist. -- - Hopefully interested in making things and solving problems. -- - Willing to hack your way through code and detail-oriented media production. --- name: involves # What is involved -- ## Front-end web development Mastering the code. - Hypertext Markup Language (HTML) -- - Cascading Style Sheets (CSS) -- - Javascript (JS) --- template: involves ## Back-end web development - Sorry... we're not covering this! --- template: involves ## Databases - Sorry... we're not covering this! --- template: involves ## Mastering tools of the trade - A good code editor -- - A good code editor -- - Web browser developer tools -- - Web servers -- - file transfers -- - a small bit of Git -- - a small bit of GitHub -- - basic UNIX commands --- template: involves ## Mastering media production - Photoshop -- - Illustrator -- - Wireframe and site map diagrams -- - Multi-track audio -- - Video -- - A very brief look at Animation --- template: involves ## Understanding Internet culture - Copyright law -- - The free software movement -- - Web ethics and the surveillance state --- name: how-course-works # How this course works -- ## Lecture I will speak for 125 minutes, four times per week. -- - That's 500 minutes (8 hours 20 minutes) of talking each week. -- - For your sake and mine, I sincerely hope that you will interrupt me. -- - Ask lots of questions... comment upon the material... anything, please. --- template: how-course-works ## Notes I write notes for most lecture topics. You may find them useful but incomplete. --- template: how-course-works ## Slides I try to keep slides as a list of topics and points, for your future reference. - They are, by nature, incomplete, unless I were to simply read from them like a robot. --- template: how-course-works ## Reading Reading assignments from the textbook and elsewhere each class. -- - The textbook is quite thorough, but not exactly necessary if you pay close attention and are willing to do some self-study. --- template: how-course-works ## Assignments You will have somewhere around 10 assignments. -- - You lose 10 points for each day late and we do not accept submissions more than 3 days late. -- - See [the syllabus](#main-links) for the complete lateness policy. --- template: how-course-works name: extensions ## Extensions Please do not ask for an extension. -- - You are hereby granted 2 free extensions for work submitted up to 3 days past the due date. --- template: how-course-works ## Quizzes For every new topic, you will take a simple multiple-choice online quiz. -- - These are meant to help you self-assess your own mastery of conceptual material. -- - Try your [first quiz](https://forms.gle/5XXNtFUZ9JDicTqf8)! --- template: how-course-works ## Exams You will take 2 exams. -- - They are likely to consist entirely of multiple-choice questions. -- - Students who come to class do better. --- template: how-course-works ## Grading - 35% assignments - 25% first exam - 25% second and final exam - 15% quizzes --- template: how-course-works ## Messaging We use Slack for all communication outside of the classroom. -- - You must create a private channel in Slack with the name following the pattern, `fb1258`, where `fb1258` is replaced with your own NYU Net ID. --- template: how-course-works ## Tutoring Tutors are waiting to answer your questions virtually all day every day of the week. -- - See them often. See them fast. -- - Check [the syllabus](#main-links) for the complete tutoring schedule. --- name: do-now # What to do now --- template: do-now ## Review the syllabus [The syllabus](#main-links) contains basic information on how this course works. --- template: do-now ## Bookmark the schedule [The schedule](#main-links) contains a day-by-day breakdown of everything you need to know and do in this course. --- template: do-now ## Complete the consent form Your consent is necessary since we use software that is not obliged to abide by the [Family Educational Rights and Privacy Act](https://studentprivacy.ed.gov/ferpa) (FERPA). - https://goo.gl/forms/uxxgA3D9F3kA0KAR2 Contact me if you have concerns about privacy. --- template: do-now ## Download and install a decent code editor A decent code editor, such as Visual Studio Code, is indispensible. In fact, you are required to install Visual Studio Code: - https://code.visualstudio.com --- template: do-now ## Download and install a file transfer program In order to publish web pages, you must be able to [transfer files from one computer to another on the Internet](/content/courses/web-design/transfer-files-to-server). Cyberduck is a perfectly adequate free program to do so. - https://cyberduck.io/ --- template: do-now ## Install Git Git is "[version control software](/content/courses/software-engineering/slides/version-control-systems)" to help keep an archive of all changes in the code of a project. - OS X users: https://git-scm.com/ - Windows users: https://gitforwindows.org/ --- template: do-now ## Set Up Bash on Windows WINDOWS USERS - you should use Git Bash or [Windows Subsystem for Linux](https://docs.microsoft.com/en-us/windows/wsl/install) (WSL) rather than Windows' default Powershell or other command line shell program. - Set Git Bash or WSL as the default terminal shell within Visual Studio Code on Windows by following the instructions in [the second answer here](https://stackoverflow.com/questions/42606837/how-do-i-use-bash-on-windows-from-the-visual-studio-code-integrated-terminal) by **Mahade Walid** and edited by **FruityOatyBar** (ignore the first answe, which is outdated). --- template: do-now ## Create a GitHub account GitHub is a website owned by Microsoft for sharing and collaborating on code projects that use Git. - https://github.com --- name: conclusions # Conclusions -- - Welcome! -- - Look around the web... see what interesting things people are doing. -- - Try to look at a diverse array of web sites and apps, not just Google, Facebook, Instagram, Amazon, etc. -- - Thanks. Bye.