Guia de referencias sobre estudo de JavaScript

0-contribua-.md

Contribua

Se você quiser adicionar mais algum tópico deixe seu comentário, o objetico é facilitar para os iniciantes ou aqueles que buscam dominar JavaScript, quais tópicos são importantes para dominar JavaScript.

São tópicos para quem sabe o minimo de JavaScript (declarar variáveis), a ordem em que eles aparecem são por importância para o dominio como um todo. Mesmo que você já tenha experiência com JS, recomendo que leia os links de cada tópico para fortalecer suas bases teóricas e ter um comportamento mais profundo da linguagem.

Lista originalmente criada e compilada por Vinicius Reis

guia-de-estudos-js.md

Guia de referencias para estudo de JavaScript

Tópicos de estudo para JavaScript

Base JS

• Lexical Scope (Escopo Léxico)
• Prototype chain (Herança e cadeia de protótipos)
• Funções Construtoras
• ES6 Class
• Factory
• Mixins
• Composição
• Composição vs Herança Clássica
• Funções Construtoras vs Factory
• Funções Construtoras vs ES6 Class

Aprofundamento

• call, bind, apply
• Async/Sync (event loop)
• Callbacks
• Promises
• Lexical this
• UMD/AMD
• ESModules

Links por tóṕicos

Base JS

• Lexical Scope (Escopo Léxico)
  • https://medium.com/@nickbalestra/javascripts-lexical-scope-hoisting-and-closures-without-mystery-c2324681d4be
  • https://spin.atomicobject.com/2014/10/20/javascript-scope-closures/
  • https://www.youtube.com/watch?v=fBInMy61plk&index=1&list=PLy5T05I_eQYNQs4Pta85XRSucm3IOHx2M
• Prototype chain (Herança e cadeia de protótipos)
  • https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain
  • https://javascript.info/prototype-inheritance
  • https://medium.com/@kevincennis/prototypal-inheritance-781bccc97edb
• Funções Construtoras
  • https://tableless.com.br/javascript-objetos-literais-vs-funcoes-construtoras/
  • http://wbruno.com.br/javascript-puro/orientacao-a-objetos-em-javascript-funcao-construtora/
  • http://blog.caelum.com.br/criacao-de-objetos-em-javascript/
  • https://www.w3schools.com/js/js_object_constructors.asp
  • https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/Object/constructor
  • https://developer.mozilla.org/pt-PT/docs/Javascript_orientado_a_objetos
• ES6 Class
  • https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript
  • https://medium.com/javascript-scene/master-the-javascript-interview-what-s-the-difference-between-class-prototypal-inheritance-e4cd0a7562e9
  • https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Classes
• Factory
  • https://www.youtube.com/watch?v=ImwrezYhw4w
  • https://medium.com/javascript-scene/javascript-factory-functions-with-es6-4d224591a8b1
  • https://nandovieira.com.br/design-patterns-no-javascript-factory
  • http://www.dofactory.com/javascript/factory-method-design-pattern
• Mixins
  • https://medium.com/javascript-scene/functional-mixins-composing-software-ffb66d5e731c
  • https://javascript.info/mixins
  • https://imasters.com.br/front-end/mixins-em-javascript
• Composição
  • https://medium.com/javascript-scene/master-the-javascript-interview-what-is-function-composition-20dfb109a1a0
  • https://medium.com/code-monkey/object-composition-in-javascript-2f9b9077b5e6
  • https://alligator.io/js/class-composition/
• Composição vs Herança Clássica
  • https://medium.com/javascript-scene/javascript-factory-functions-vs-constructor-functions-vs-classes-2f22ceddf33e
  • https://www.youtube.com/watch?v=wfMtDGfHWpA
  • https://medium.com/javascript-scene/the-hidden-treasures-of-object-composition-60cd89480381
• Funções Construtoras vs Factory
  • https://medium.com/@viniazvd/classes-vs-funções-construtoras-vs-funções-fábrica-b92a6afa70a4
• Funções Construtoras vs ES6 Class
  • https://medium.com/javascript-scene/javascript-factory-functions-vs-constructor-functions-vs-classes-2f22ceddf33e

Aprofundamento

• call, bind, apply
  • http://programadorobjetivo.co/call-apply-e-bind-em-javascript/
  • https://medium.com/@omergoldberg/javascript-call-apply-and-bind-e5c27301f7bb
  • http://javascriptissexy.com/javascript-apply-call-and-bind-methods-are-essential-for-javascript-professionals/
• Async/Sync (event loop)
  • https://www.youtube.com/watch?v=va8-xdxTywU
  • https://medium.com/@gaurav.pandvia/understanding-javascript-function-executions-tasks-event-loop-call-stack-more-part-1-5683dea1f5ec
  • https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/EventLoop
• Callbacks
  • http://javascriptissexy.com/understand-javascript-callback-functions-and-use-them/
  • https://developer.mozilla.org/pt-BR/docs/Glossario/Callback_function
  • http://programadorobjetivo.co/tudo-sobre-javascript-callbacks/
• Promises
  • https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/Promise
  • https://tableless.com.br/fluxo-de-execucao-assincrono-em-javascript-promises/
  • https://spring.io/understanding/javascript-promises
• Lexical this
  • https://hackernoon.com/javascript-es6-arrow-functions-and-lexical-this-f2a3e2a5e8c4
  • https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Functions/Arrow_functions
  • https://toddmotto.com/es6-arrow-functions-syntaxes-and-lexical-scoping/
• UMD/AMD
  • https://www.davidbcalhoun.com/2014/what-is-amd-commonjs-and-umd/
  • https://blog.da2k.com.br/2015/01/05/como-criar-componentes-js-usando-modulos-amd-commonjs-e-umd-parte-3-3/
  • https://www.jvandemo.com/a-10-minute-primer-to-javascript-modules-module-formats-module-loaders-and-module-bundlers/
• ESModules
  • https://hacks.mozilla.org/2018/03/es-modules-a-cartoon-deep-dive/
  • https://nodejs.org/api/esm.html
  • http://2ality.com/2014/09/es6-modules-final.html

outros-links.md

Outros links e referencias

Canais do YouTube

• Fun Fun Function - https://www.youtube.com/channel/UCO1cgjhGzsSYb1rsB4bFe4Q
• Pagar.me Talks - https://www.youtube.com/channel/UCNhSCufrcOMeFvzEM7tt9Lw
• Filipe Deschamps - https://www.youtube.com/channel/UCU5JicSrEM5A63jkJ2QvGYw
• CodeCasts - https://www.youtube.com/channel/UCTluPqMkm90zyw6mCde561A
• BrazilJS - https://www.youtube.com/user/BrazilJS
• Rodrigo Branas - https://www.youtube.com/channel/UCkqOofjb7nl6V8vXrIbGtiQ
• Wes Bos - https://www.youtube.com/user/wesbos
• freeCodeCamp - https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ
• Google Chrome Developers - https://www.youtube.com/channel/UCnUYZLuoy1rq1aVMwx4aTzw

Sites/Artigos

• http://es6-features.org/#Constants
• https://medium.com/@matheusml/o-guia-do-es6-tudo-que-você-precisa-saber-8c287876325f
• https://babeljs.io/docs/en/learn/
• https://medium.com/javascript-scene
• https://blog.codecasts.com.br/ecossistema-javascript-parte-01-plataformas-7a611608b58
• https://blog.codecasts.com.br/single-page-applications-onde-vivem-e-o-que-comem-4fc9a44f3de
• https://blog.codecasts.com.br/heranca-e-composicao-com-vue-js-c74177f37e36
• https://blog.codecasts.com.br/auto-carregamento-de-rotas-em-projetos-node-js-d9a7f4ec105d
• https://codeburst.io/how-node-js-single-thread-mechanism-work-understanding-event-loop-in-nodejs-230f7440b0ea
• https://medium.freecodecamp.org/what-exactly-is-node-js-ae36e97449f5

Grupos de JavaScript (Telegram)

• https://t.me/javascriptbrasil
• https://t.me/vuejsbrasil
• https://t.me/quasarframeworkbrasil
• https://t.me/EmberBR
• https://t.me/NodejsBR
• https://t.me/NodeBR
• https://t.me/reactjs_br
• https://t.me/frontendbrasil
• https://t.me/electronJs_BR
• https://t.me/wwwdev
• https://t.me/polymerbr
• https://t.me/reactnativedrops
• https://t.me/angularJSBrasil
• https://t.me/ionicbrasil
• https://t.me/typescriptbr
• https://t.me/devcordova
• https://telegram.me/dartbrasil
• https://t.me/stenciljsbrasil

Canais do youtube
The Net Ninja: https://www.youtube.com/channel/UCW5YeuERMmlnqo4oq8vwUpg
Academind: https://www.youtube.com/channel/UCSJbGtTlrDami-tDGPUV9-w

Sites:
Eloquente Javascript (tradução no repositório da BrazilJS): https://github.com/braziljs/eloquente-javascript
Eloquent Javascript (site oficial em inglês): https://eloquentjavascript.net/

mero inciante aqui :/

Parabéns pelo excelente trabalho 👏

Sugestão de referência de site:
https://roadmap.sh/javascript