Learn Front End UI Design 2020
1.0.0
学习编程/前端开发（HTML/CSS/JavaScript）
前端开发人员与后端开发人员的后端开发人员不同，可以操纵浏览器以创建网页和其他交互式内容。要学习前端开发，您可以从HTML，然后是CSS开始，然后再开始JavaScript。一旦学习了这些，您就可以继续进行其他框架（bootstrap，react，angular，vue等）之类的东西。一旦学习了这三个的基础知识，您就可以开始学习。框架使生活更轻松。
一个好的程序员不必记住一切。开源代码为Web提供动力，并允许程序员免费使用和交换代码（请查看“掌握前端”下方的一些贡献的开源指南）。如果您被困在Google上。您可能会找到答案。
那里有一百万个教程。请注意不要陷入所谓的“教程地狱”中，您只是无休止地观看教程，但从未学到任何具体的东西。最好的学习方法是做。这样的锻炼网站派上用场，但您也想考虑要建立的项目。在Github上托管这些项目的投资组合。或查找项目的项目。
使用Google Chrome开发人员工具，您可以检查任何网站背后的代码或进行不活跃的更改。像Firefox这样的其他浏览器也具有这些工具。成为你最好的朋友。
YouTube总体上是一个非常好的资源。您想知道的任何东西。它可能在那里。像Wes Bos一样，许多受人尊敬的程序员都在那里。还要在Twitter上关注其他开发人员。
YouTube主列表-https：//github.com/erikch/devyoutubelist
要知道的另一个重要的事情是，您不必知道所有的事情就可以找到第一份工作或工作。编程总是在变化。一项好工作将使您在工作中学习，希望付钱给您学习一些东西，并教您不需要知道的内容。
问问题 - 毫无疑问是一个愚蠢的问题。首先使用Google。如果失败了，请通过论坛，堆栈溢出，Facebook组或Twitter与其他程序员联系。有人会很乐意为您提供帮助。
我怎么知道我准备好了？
当您可以创建一个基本网站并拥有几个不同项目的投资组合时。
带有静态和原型设计的网站
展示您的代码的github
如果您在已经居住的网站上工作，则不需要GitHub。但是它们非常适合那些不活的项目。
无论您做什么，自由职业者或志愿者项目都将帮助您获得EXP，以防您无法获得实习。但是，开发人员实习通常向毕业的人开放，因为很多人职业生涯swtich。您也可以开始应用于初级职位。查看开源项目，配对的编程以及与朋友的纠缠。
编程资源
（其他列表）
https://www.womenwhocode.com/resources
http://codingheroes.io/resources/
要点 -
GitHub-在线代码存储库，以展示和加入开源项目
git＆github教程-https：//youtu.be/swyqp7iy_tc
codepen-探索和创建浏览器-https：//codepen.io/dashboard/
Sublime文本 - 简单，免费的代码编辑器-https：//www.sublimetext.com/
VS代码 - 是当前的，更高级的，免费的代码编辑器-https：//code.visualstudio.com/
Chrome Dev工具 - 直接在浏览器中打开，以测试，Diaogognose和Explore网站-https：//developers.google.com/web/tools/chrome-devtools
开发人员的博客-https：//dev.to/
Stack Overflow非常适合查找答案和内容，但众所周知，社区对新手或女性不友好-https：//stackoverflow.com/
前端新闻 - 保持最新 - https：//frontendfront.com/
前端焦点 - 与此新闻通讯保持最新状态-https：//frontendfoc.us/
基本话题和概念
互联网和计算机的工作方式-https：//www.khanacademy.org/computing/computer-science/computers-andcomputers-and-internet-code-org#internet-works-intro
什么是计算机科学？ -https：//www.freecodecamp.org/news/what-is-computer-programming-defining-software-development/
响应式网络设计-https：//www.smashingmagazine.com/2011/01/guidelines-for-responsive-web-design/
交叉浏览器开发-https：//developer.mozilla.org/en-us/docs/learn/learn/tools_and_testing/cross_browser_testing/introduction
敏捷方法论-https：//www.youtube.com/playlist?list=plwkjhjtqvabm0gpnunwf4pr4xv8i3i3geh--
网页速度测试-https：//tools.pingdom.com/
保罗·福特（Paul Ford）的《什么是代码10,000单词在线小说》 -https：//www.bloomberg.com/graphics/2015-paul-ford-what-is-code/
调试初学者 - 调试是查找和解决错误的过程-https：//docs.microsoft.com/en-us/visalstudio/debugger/debugger/debugging-absolute-beginner-
掌握前端
100天的代码 - 其背后的想法是可靠的，重新的，问责制和进度-https：//www.100daysofcode.com/
网络技能指南-https：//andreasbm.github.io/web-skills/
w3schools-学习编程并在上面查找内容 - 参考资源 - https://www.w3schools.com/
*Mozilla开发人员的网络 - 就像W3Schools一样，但更成熟，更深入的最新姐妹-https：//developer.mozilla.org/en-us/
前端开发人员在2019年使用的工具-https：//ashleynolan.co.uk/blog/frontend-tooling-survey-2019-results
路线图 - 2020年成为前端开发人员指南https://roadmap.sh/frontend
前端开发人员2020指南-https：//youtu.be/sppsnbqvt0k
面试前端的问题（即您可以回答这些问题吗？）
前端开发人员访谈问题和答案-https：//www.fullstack.cafe/blog/front-end-end-developer-interview-questions
插图开发 - 说明开发人员概念-https：//illustrated.dev/
采访蛋糕 - 学习CS以及如何解决程序员访谈-https：//www.interviewcake.com/
编程访谈YouTube -https：//www.youtube.com/playlist?list=plwkjhjtqvablv09g3sfgrmser0jnkqmj9
贡献开源的定义指南-https：//www.freecodecamp.org/news/the-definistive-guide-guide-to-contributing-to-open-source-900d5f9f2282/
如何做出贡献-https：//github.com/firstcontributions/first-contributions
很棒的PR列表（拉请求）-https：//github.com/mungell/awesome-for-beginners
仅第一个计时器 - 首次为开源项目做出贡献的资源-https：//www.firsttimersonly.com/
配对编程的优缺点（当您和队友在同一代码上一起工作时）-https：//www.freecodecamp.org/news/the-benefits-and-pitfits-and-pitfalls-of-pair-pair-pair-pair-programming-in-the-workplace-workplace-workplace-e68c3ed3c81f/
内容管理系统
WordPress-有很多工作需要您知道如何使用这些工作-WordPress.org / wordpress.com
Drupal
WebFlow（较新，但周围有很多谈话）
教程和其他人
Freeecode Camp-您可以使用的最佳免费资源之一-https：//www.freecodecamp.org/
Khan Academy-拥有出色的编程课程，也可以查看他们的计算机科学内容-https：//www.khanacademy.org/computing/computer-promporming
codeacademy-最喜欢的，但您必须在某个时刻付款-https：//www.codecademy.com/
前端大师 - 学习前端发展 - https：//frontendmasters.com/
Udemy-签出他们的免费课程，然后等待上课的销售-https://www.udemy.com/courses/free/
有思想的网络研讨会 - 有一堆免费的初学者网络研讨会 - https://www.thinkful.com/webinars/
Tree House-一个很棒的大调/投资组合/学位网站，但价格昂贵-https：//teamtreehouse.com/
hackr.io-教程和其他学习-https：//hackr.io/
Egghead-教程 - https：//egghead.io/
LinkedInlearning
Coursera
技能共享
练习
练习 - 练习学习编程-https：//exercism.io/
EDABIT-学习互动挑战的编码-https：//edabit.com/
代码大战 - 每日编程挑战-https：//www.codewars.com/
html/css/javaScript细节
html崩溃课程-https：//youtu.be/pqn-pnxpavg; https://youtu.be/ub1o30fr-ee
HTML和CSS书籍 - 一本流行的书籍，其中包含在线代码示例-http：//www.htmlandcssbook.com/
CSS速效课程-https：//www.youtube.com/watch?v=yfoy53qxeni
CSS技巧 - CSS和其他前端开发的博客-https：//css-tricks.com/
CSS Podcast- https://pod.link/thecspodcast
CSS生成器 - 快速生成CSS -http：//css3generator.com/
CSS Diner -https：//flukeout.github.io/
CSS网格-https：//cssgrid.io/; https://learncssgrid.com/
CSS Flexbox- https://css-tricks.com/snippets/css/a-guide-to-flexbox/
CSS框型号-https：//css-tricks.com/the-css-box-model/
Bootstrap -A CSS，前端框架-https：//getbootstrap.com/
CODROPS-凉爽编码的片段-http：//tympanus.net/codrops/
雄辩的JavaScript-一本阅读书籍（带有浏览器编程实践）https://eloquentjavascript.net/eloquent_javascript.pdf
JavaScript和JQuery-一本具有代码示例的流行书-http：//www.javascriptbook.com/
jslint-“ lints”是在您的代码中找到问题的程序-http：//www.jslint.com/
JavaScript30-创建30个不同的香草JavaScript项目-https：//javascript30.com/
初学者JavaScript- WES BOS的付费课程-https：//beginnerjavascript.com/
Just JavaScript-解释JavaScript的新闻通讯-https：//justjavascript.com/
Vanilla JavaScript项目 - +20普通JavaScript项目-https：//vanillawebprojects.com/
完整的JavaScript基础视频-https：//youtu.be/pkzno7mfnfg
html在12分钟内-https：//youtu.be/bwpmsssvdpk
CSS在12分钟内-https：//youtu.be/0afzj1g0bie
JavaScript 12分钟-https：//youtu.be/ukg_u3cnjwi
更高级的代码和TopCis和计算机科学 -
Google开发人员 - 教程和其他资源-https：//developers.google.com/
选择一个JS框架开始（React，Angular，Vue）。您选择哪个公司并不重要，但是有些公司比其他公司更喜欢它们。反应是最受欢迎的，其次是角，然后是VUE。并不是很多人都知道Vue，但实际上确实是在寻找它。因此，也许反应或角度和vue在一起可能是一个强烈的选择。
前端框架的历史 - https://youtu.be/kzeog8ytfae
REECT -https：//www.youtube.com/playlist?list=plwkjhjtqvabkardmazoartnz1amwnwmvc; https://www.youtube.com/playlist?list = plc3y8-rfhvwgg3vayjghgnmodb54rxok3
angular -https：//www.youtube.com/playlist？list = plwkjhjtqvablnvgkkkk6aqvpapajhxrrxxhts
VUE -https：//youtu.be/wy9q22isx3u
php -https：//www.youtube.com/playlist？list = plwkjhjtqvabkomsx4hgwxbjzw4ab0cbab
sql- https://www.khanacademy.org/computing/computer-programming/sql
API -https：//youtu.be/gzvsyjdk-us
来自Havard的计算机科学-https：//www.youtube.com/playlist?list=plwkjhjtqvabmgw5fn5bqlwuug-8bdmabi
计算机科学-https：//www.youtube.com/playlist?list=plwkjhjtqvabn5emq3rrg8gebqkhf_5vxd
Google材料-https：//material.io/design/
什么是区块链？ -https：//www.freecodecamp.org/news/what-is-blockchain-and-how-does-it-work/
可访问性
Web内容可访问性指南（WCAG）-https：//www.w.org/wai/standards-guidelines/wcag/
ADA清单（2019）-https：//medium.com/@krisrivenburgh/the-ada-checklist-website-compliance-guidelines-guidelines-for-2019-in-plain-plain-English-123c1d58fad9
A11Y清单（查看A11Y新闻通讯）-https：//a11-尼11-访问
开发人员的Web可访问性-https：//www.wuhcag.com/wcag-checklist/
您可以采取15件事来改善网站可访问性-https：//websitesetup.org/web-accorcesibility-Cecklist/
只是为了好玩 -
处理 - 一种基于Java的编程语言，用于创建动画，游戏和交互式艺术-https：//processing.org/
大会 - 另一个证书地点，但也有一些免费的东西-https：//generalassemb.ly/blog/free-fridays/
开发人员和技术社区
https://womeninwebdev.com/
https://www.hiretechladies.com/
参与开发人员-https：//www.pluralsight.com/courses/get-involved
CodeNewbie- https://www.codenewbie.org/
Hackernoon-社区博客，学习资源等 - https://hackernoon.com/
http://ladydev.org/（得梅因的当地俱乐部，他们也经营地区515）
工作委员会
兽医-https：//www.vettery.com/candidate/tech
triplebyte- https://triplebyte.com/
Angellist-启动UPS的工作-https：//angel.co/jobs
我们远程工作 - https：//weworkremotely.com/
骰子-https：//www.dice.com/
堆栈溢出-https：//stackoverflow.com/
codepen -https：//codepen.io/jobs/
AIGA设计工作-https：//designjobs.aiga.org/
Behance -https：//www.behance.net/joblist
设计观察者-https：//designobserver.com/jobs/
在UX设计的神奇世界中，用户界面，Web设计，视觉设计等，存在许多基本相同或完全相关的标题。如果您真的愿意，则订单可能是视觉设计师，Web Designer，用户界面设计器，交互设计器....等。 （很快进入UX）。
UI与UX不同。 UX是设计和人力计算机的研究和心理学的研究。 UI处理视觉内容。
通过从诸如
粉碎杂志，https://www.smashingmagazine.com/
muzli，https://muz.li/
UX Planet，https://uxplanet.org/
Protypr，https://blog.prototypr.io/
UX Collective https://uxdesign.cc/
尼尔森·诺曼（Neilsen Norman）集团https://www.nngroup.com/
MockPlus https://www.mockplus.com/blog
嘿设计师https://heydesigner.com/
设计师新闻https://www.designernews.co/
还有更多。
参加在线课程，并从CareerFoundry，Interaction Design Foundation，LinkedIn Learning等地方获得证书。阅读有关UX Planet选项的更多信息。 https://careerfoundry.com/ ** https：//www.interaction-design.org/（个人喜欢，这是我正在使用的）
启动自己的博客，并撰写有关您所知道和推荐的内容。成为社区的思想领袖。
收听播客，例如用户体验捍卫者，UX出了什么问题等等。这是2020.https：//www.mockplus.com/blog/post/ux-podcasts的最佳25个UX播客列表
参加UX网络聚会。 （Meetup。Com）
观看有关UX的YouTube频道和视频。
AJ和Smart
应用设计提示
未来
卡勒·爱德华兹（Caler Edwards）
职业生涯
丹斯基
Invision
DesignCourse
通量
LinkedInlearning
nngroup
保持最新状态，并观看有关使用草图，Invision，Figma和其他UX工具或用户研究工具等工具的教程。
完整的模拟UX和UI挑战，例如锐化的UX发电机，良好的简介和100天的DailyUI挑战。 https://www.dailyui.co/ http://goodbrief.io/ https://sharpen.design/
了解可访问性并订阅A11YWeekly新闻通讯等新闻通讯。
研究设计系统。 https://designsystemsrepo.com/design-systems/
研究可用性。 https://www.usibaly.gov/
研究设计思维。您可以首先观看纪录片或查看来自IDEO，D.SCHOOL，HCS，设计委员会，青蛙，Whatx4或Luma的不同选择。 http://www.designthinkingmovie.com/
在社交媒体上共享资源。
加入UX Facebook和LinkedIn组。在Twitter和Instagram上关注设计师。
保持UX和UX状态的趋势保持最新状态。 https://trends.uxdesign.cc/
继续改善您的投资组合（从Sarah Doody的网站中找到一些很酷的资源）和案例研究（此处找到模板生成器）。研究其他UX投资组合。 https://www.sarahdoody.com/ https://design-stories.herokuapp.com/ux-case-study-template
寻找导师或成为导师。
阅读有关UX/UI和其他类似主题的书籍。就像“不要让我思考”，“日常事物的设计”，“用户体验的要素”，“ UX项目指南”，“精益UX”等。 https://www.mockplus.com/blog/post/ux-design-books
深入研究其他UX的其他子集，例如交互设计，信息体系结构，视觉设计，UX研究，UI，UX写作等。
免费参加IXDA世界会议日或其他会议。 https://ixda.org/
加入当地俱乐部，组织和其他社区团体。
成为演讲者或开始举办研讨会。
获得HCI，UX，UI或其他类似课程的大学学位。
志愿您的技能或自由职业者。
练习，练习，练习。在业余时间创建激情项目和案例研究。
