|
所在平台: Udemy |
课程主页: https://www.udemy.com/course/the-art-of-doing-web-development-for-beginners/
课程评论:没有评论
课程名称:做的艺术:初学者的网页开发 课程概述: 本课程旨在帮助初学者掌握网页开发的基础知识,特别是如何将HTML、CSS和JavaScript的概念有机地结合在一起,设计和创建网页。作为一个有Python背景的人,学习者希望能够在浏览器中快速创建视觉效果,但在学习过程中常常感到孤立无援。 课程内容分为十个单元,首先介绍关键概念和语法,然后通过挑战性任务,鼓励学习者根据已有知识重建一份示例网站。每个单元结束时,学习者将获得构建网站所需的资产、配色方案,并通过讲解网站的思维过程来帮助他们理解如何将各个概念结合起来。最后,讲师将逐步展示自己是如何构建网站的,包括设计选择和理由。 主要内容如下: - **HTML主题**:标题和段落标签、文本格式化、列表和表格标签、属性、锚标签、图片标签、输入标签、表单标签、HTML结构等。 - **CSS主题**:样式规则、选择器方法、元素宽度、颜色定义、盒模型、文本样式、列表和表格样式、显示值(块级、行内等)、Flexbox、Grid、伪类、转换、过渡和动画等。 - **JavaScript主题**:变量声明、数据类型、数组操作、循环、条件语句、函数、文档对象模型、事件处理、表单值获取等。 课程的设计逻辑循序渐进,前面的内容在后面单元中不断被复用,帮助学习者夯实技能。课程结束时,学习者将具备用HTML、CSS和JavaScript独立设计并实施一个网页项目的能力。希望所有学习者都能充分利用这个课程,感受到每个单元和最终项目的价值。
I always wanted to learn the fundamentals of web development. I'm drawn to how easy and quickly one can create visuals to be displayed within a web browser. Coming from a background in Python where the vast majority of my learning took place in a terminal, web development seemed so enticing!However, there was one glaring problem in my web development journey. I began learning these basic concepts: what is an HTML tag, what is the CSS box model, how do I access HTML elements in JavaScript; all isolated, on an island, with absolutely zero idea how to wade through the thought process of actually putting them all together, designing, and building a website.I felt overwhelmed and lost. Sure, I thought I had the technical know-how and ability to make a website thanks to all of the tutorials that are out there. However, these other tutorials are lacking in one key area: How to tie the concepts together. What I craved after learning a collection of new concepts was an example website to try and build. I wanted a template, a challenge…"here is this site, now go see if you can build it." I wanted support so that if I struggled, I could see only what I needed to see and then be back on my way. Lastly, I wanted an explanation of how all these seemingly isolated concepts came together and worked together to create the final product of the website. I've worked really hard to try to give you that experience that I wanted so badly, here in this course.Over these 10 sections I spend time first introducing various concepts. We discuss key ideas, syntax, and how to implement various HTML, CSS, and JavaScript concepts. Then, at the end of each section I challenge you to recreate a website I have built using your knowledge up to that point in the course. I give you all the assets, the color schemes, and walk through the thought process of what the website should look like and do. Then, I leave it up to you to recreate it….or I challenge you to make something all on your own. Lastly, I go through step by step how I built my sites, what design choices I made, and how and why I made them.We will cover the following HTML topics:Heading and paragraph tagsFormatting text with various styling tagsList and Table tagsTag AttributesAnchor TagsImage TagsVarious Input TagsForm TagsProper HTML structureBlock Level and Inline ElementsDivs and SpansSemantic HTML ElementsWe will cover the following CSS topics:CSS Styling RulesCSS Selector MethodsElement Width and SizeDefining ColorThe Box ModelStyling TextStyling Lists and TablesVarious Display Values (block, inline, inline-block)FlexboxGridPseudo ClassesTransformsTransitionsAnimationsWe will cover the following JavaScript topics:Declaring VariablesVarious Data TypesWorking With ArraysFor Loops and While LoopsConditional Statements and Switch CasesWriting FunctionsDocument Object ModelgetElementById()querySelector()JavaScript EventsGetting values from Input FieldsGetting Values From HTML FormsEach unit is sequential so the content we cover in unit 1 is still used in unit 10. This provides great scaffolding allowing you to really hone your skills and understanding of the material. I hope that by the end of this course you feel that each unit, each video, and each final project are of value and that you are well equipped to come up with a design idea and implement it using HTML, CSS, and JavaScript alone!