curso-reactjs-ninja's People
Forkers
roberthpereira nilocesar tannusesquerdo ribeiroevandro simonemyrrha rj-dev jacx16 juniorsilva42 bcdds marcelohmdias jeftarmascarenhas willianribeiro brunopulis lucianobaraunalabs nailtonrf lganet weberamaral virginiarcruz gustavosobral jonroosevelt wsduarteoficial alinebastos adeonirlabs michaelsnogueira nibarcellosdev ldpereira jonas-medpass weider86-zz angelomedeiros huanchicayd frankyston brunogcpinheiro lxspandora ricardofressa senhordim caioincau nata27junior joserfjuniorllms mvcbotelho hhendrikk assoares2014 wesmelo azevedorafael reinaldorossetti marcosteotonio ramonmatias19 ffabiorj tgmarinho woliveiras beamarawn renatolcosta venturalp willianrssi joelspinelli marlonflorencio alisonfgt carlosmachel kenjiyamamoto igorthurow rigote cesarliws mlucasc paulojosern gustavogottardi hjdesigner heredia76 orivelton rodrigowpl kleberfreire dreecarvalho felipedorth tarcisiopqdt hiwoshu marcoaraujolsys flavioribs lucmkz isaacuchoa leticiamachadoo danvitoriano kelvinfrade calleufuzi mariana-cunha joaopaulolira robson01jc helenapaixao ruanvalente lucasbelizari mlsalessantos dricosta marcus-viniciuss carolsoaressantos carolinnerodrigues leopeli ago3t1nho gaboso felipeuliana danyelesales lwauke lclsouza cristopherjonascurso-reactjs-ninja's Issues
Conflito de versão no babel
Fala @fdaciuk blza? tive um imprevisto aqui estou no começo do curso e tinha importado a ultima versão do babel 6. alguma coisa e não estava indo por nada, resolvi colocar a 5. alguma coisa q no caso do vídeo era a que você usava, e funcionou.
vou dar sequencia no curso, no caso pelo que entendi algo que era necessário foi removido do babel 5 pra 6, preciso me preocupar?
React + Webpack #09
Fiz toda a configuração do Hot Loader porém ele não atualiza a página.
No console exibe as mensagens:
[HMR] Waiting for update signal from WDS...
ReactDOM.js:75 Download the React DevTools for a better development experience: https://fb.me/react-devtools
client?843a:37 [WDS] Hot Module Replacement enabled.
2client?843a:37 [WDS] App updated. Recompiling...
client?843a:37 [WDS] App hot update...
2client?843a:37 [WDS] App updated. Recompiling...
client?843a:37 [WDS] App hot update...
2client?843a:37 [WDS] App updated. Recompiling...
client?843a:37 [WDS] App hot update...
Reparei que no vídeo, no seu console são exibidas algumas mensagens a mais, do only-dev-server e do log-apply-result.
Problema com API GH
Fala @fdaciuk, beleza? Estou com um probleminha aqui, que não consigo resolver!
Estou na aula "M1#A43 - GitHub app - método para buscar repositórios e favoritos". Finalizando o request dos repositórios e colocando na tela.
O que está acontecendo é o seguinte:
Quando vou dar um setState({ }) com o retorno da promise, ele não faz nada. Se dou console.log(result)
todos os dados estão ali corretos. Não da erro no console nem no devtools do React. Vou deixar o link do meu app.js.
Fico no aguardo e enquanto isso vou tentando resolver, valeu!
https://github.com/gabrielferreiraa/bp_react/blob/master/github-app/src/app.js (line 45)
M1#A29 - Duvida sobre radio button
Professor, na aula o senhor explica como trabalhar com checkbox, mas na parte de radio button a explicação ficou meio rasa, tentei fazer aqui um exemplo de radio button, a ideia é a mesma do checked e tal, mas se houver mais de 2 radio buttons, é preciso de uma abordagem diferente para controlar, o conceito foi intendido mas durante o curso faremos algum componente usando radio buttons ? só pra fixar melhor na pratica ?
M2#A29 - Lançamento de exceções
Fala, @fdaciuk ! Eu aqui de novo 😄
Nesta aula você mostra como tratar exceções caso o usuário passe parâmetros diferente do esperado (na implementação imperativa).
Eu adicionei o tratamento na implementação recursiva, porém não consegui substituir os if's por ternário de modo que o código continuasse legível haha.
Qual seria a solução mais elegante pra esse caso?
'use strict'
const map = (arr = [], func = (item) => item) => {
/* --- Aqui --- */
if (!Array.isArray(arr))
throw new TypeError('First parameter must be an array');
/* --- E aqui --- */
if (typeof func !== 'function')
throw new TypeError('Second parameter must be a function');
const counter = 0;
return (function mapInternal (arrInternal, counter) {
const [head, ...tail] = arrInternal;
return arrInternal.length === 0 ? [] : [
func(head, counter, arr),
...mapInternal(tail, counter + 1)
];
})(arr, counter);
}
export default map;
M2#A13 - Map recursivo
Faaaala Daciuk, tudo certin?!
Em um ponto da aula 13 temos este código [1]. Neste momento você comenta que para termos uma programação 100% funcional precisamos remover o if. Então chegamos a este outro código [2].
A minha pergunta é: por que em programação funcional não poderiamos ter o if? O ternário faz quase a mesma coisa (ao meu ver), mas ele é permitido e o if não, por quê isso ? .-.
Me ajuda a esclarecer? Abraço!
[1]
'use strict'
const map = (arr = [], func = (item) => item) => {
const counter = 0;
return (function mapInternal (arrInternal, counter) {
if (arrInternal.length === 0)
return [];
const [head, ...tail] = arrInternal;
return [
func(head, counter, arr),
...mapInternal(tail, counter + 1)
];
})(arr, counter);
}
export default map;
[2]
'use strict'
const map = (arr = [], func = (item) => item) => {
const counter = 0;
return (function mapInternal (arrInternal, counter) {
const [head, ...tail] = arrInternal;
return arrInternal.length === 0 ? [] : [
func(head, counter, arr),
...mapInternal(tail, counter + 1)
];
})(arr, counter);
}
export default map;
M1#011 - Dúvida import React.
Você mostrou nessa aula como criar o component Title com função pura.
E ai por curiosidade como aquele módulo era só ES6 ao meu ver poderia remover o import do React, porém quando remove ele fala que React is not defined
.
Porque ele dá o erro sendo que não estamos usando nenhuma feature do React dentro do component?
m2A73
Fala Daciuk!
Estou construindo um script de atualização utilizando o child-process
semelhante ao que fizemos na aula 73 do modulo 2, e está me retornando um erro ao executar o comando yarn add
, segue:
Error: spawn yarn ENOENT
at exports._errnoException (util.js:1050:11)
at Process.ChildProcess._handle.onexit (internal/child_process.js:193:32)
at onErrorNT (internal/child_process.js:367:16)
at _combinedTickCallback (internal/process/next_tick.js:80:11)
at process._tickCallback (internal/process/next_tick.js:104:9)
at Module.runMain (module.js:607:11)
at run (bootstrap_node.js:423:7)
at startup (bootstrap_node.js:147:9)
at bootstrap_node.js:538:3
Sabe o que pode ser?
Obs: Estou usando a versão 7.9.0 do node
Valeu!
M2#A51 - Dúvida Gulp
webpack.config.js usando ES6
Como fazer pra poder escrever o arquivo webpack.config.js usando ES6. Pra poder usar import ao invés de require.
O correto seria usar tudo import, que é o padrão ES6, certo?
React Router
Professor, sobre o modulo#04 que vai ser sobre o react-router, vai demorar muito pra sair ? porque não é com essa lib que se faz as SPA ?
create-app
Comecei o curso recentemente e tive alguns problemas relacionado a versões, tanto do próprio React quanto das ferramentas.
Vou começar a app do primeiro módulo, posso usar o create-app do react, ao invés do boilerplate que fizemos no começo do curso?
M2#A51 - Paginação - ambiente para testes - linter
Olá @fdaciuk, tudo bem?
Será que você consegue me ajudar?
Obs.: Estou utilizando SO Windows 8 - 64 bits
Estou com problemas ao executar o Lint. Quando executo o comando: yarn lint:watch, o seguinte erro é exibido:
yarn lint:watch v0.21.3
$ gulp
[08:06:43] Using gulpfile E:\react\cursos\da2k\curso-reactjs-ninja\examples\m02\applications\github-app\gulpfile.js
[08:06:43] Starting 'lint'...
events.js:160
throw er; // Unhandled 'error' event
^Error: spawn yarn ENOENT
at exports._errnoException (util.js:1022:11)
at Process.ChildProcess._handle.onexit (internal/child_process.js:193:32)
at onErrorNT (internal/child_process.js:359:16)
at _combinedTickCallback (internal/process/next_tick.js:74:11)
at process._tickCallback (internal/process/next_tick.js:98:9)
at Module.runMain (module.js:606:11)
at run (bootstrap_node.js:394:7)
at startup (bootstrap_node.js:149:9)
at bootstrap_node.js:509:3
error Command failed with exit code 1.
Duvida sobre react + webservice
Duvida,
Eu já tenho um webservice rodando.. e quero fazer um CRUD de uma forma simples consumindo-o
O que usar em conjunto com o React? O Redux seria pra isso?
Dúvidas CSS Modules
Bom dia meu querido @fdaciuk, tudo certo ?
Aqui estou eu praticando meu lindo React. Até o momento estou usando a estrutura inicial sua, passada em aula, de CSS Modules, com CSS puro, importando ele dentro do JS e colocando no className
. Porém, agora vi a necessidade de ter uma estrutura parecida com um ambiente de pré processadores.
Preciso ter um arquivo de CSS centralizado, com as cores padrão do meu site por exemplo, as fontes padrão, usar uma classe de forma global, importando um mixin
por exemplo. Como o CSS Modules de comporta diante disso ? Eu vi que ele tem um tal de composes
, mas não achei tão interessante rs, acho que não usei ele pra valer mesmo. Você acha necessário usar SASS juntamente com o CSS Modules, ou você acha desnecessário ?
Consegue me dar uma mão / ajuda em relação a isso? Qual seria o ambiente adequado para trabalhar com CSS dentro da estrutura do React com Webpack ?
Grande abraço!
[Dúvida] createClass
Boa noite meu querido!
Estou com uma duvida a umas 3 lições já, no meu console está aparecendo um warning de createClass deprecated, segue:
Warning: Accessing createClass via the main React package is deprecated, and will be removed in React v16.0. Use a plain JavaScript class instead. If you're not yet ready to migrate, create-react-class v15.* is available on npm as a temporary, drop-in replacement. For more info see https://fb.me/react-create-class
Fui dar uma olhada mas não estou entendendo muito bem, sou bem leigo em React o que sei estou aprendendo no curso!
Grande abraço
Dúvida
Ex.
{!!actorsObj && <Actors actorsObj={actorsObj}/>}
Desta forma, eu consigo fazer que, o componente só seja renderizado quando eu preencher este objeto, mas...
E se eu quiser que ele seja renderizado, apenas se todos valores dentro deste objeto estejam preenchidos, como faço?
#08 - Webpack - Config Webpack Dev Server
Fiz as configs iguais a da aula, porém retorna um erro quando tento rodar o script.
TypeError: webpack.HotModuleReplacementPLugin is not a constructor
Deixei todas as versões de dependências iguais a da aula em questão mesmo assim não resolveu o problema.
Link para o repositório com o código: https://github.com/williamcosta/curso-react
M2#A46 - Problema ao chamar components
Fala @fdaciuk, beleza?
Uma dúvida em relação ao storybook.
Eu instancio um componente dentro do .story.js
e esse componente tem suas dependências, que são instanciadas dentro do próprio componente.
Por exemplo: Eu instancio o componente X. Dentro do componente X, ele chama vários arquivos JS por exemplo.
Quando eu faço uma story desse componente X, o storybook pede as dependências que já estão sendo pedidas dentro do próprio componente (CSS por exemplo, ou algum outro componente secundário que ele usa).
Qual o motivo disso?
Valeu !
Dúvidas sobre Webpack etc
Fala @fdaciuk, tudo tranquilo? Estou aqui com a dúvida da semana, não te dou sossego ! hahaha
-
Estamos com aplicações pequenas até o momento e o
bundle
gerado já é de quase 3mb, e quando tivermos aplicações gigantes, iremos gerar obundle
e vai dar 20-30-40mb, como o browser lida com isso? Não há queda na performance ? Ou algo do tipo, demora para renderizar algo para o usuário. -
Como já falei pra você em issues e dúvidas passadas, estou fazendo esse curso para montar uma aplicação. Por isso as vezes faço perguntas pensando la na frente, ou perguntando coisas que "não está na hora de aprender" ainda, você deve me entender, estou correndo contra o tempo. Para começar a estruturar minha aplicação eu preciso de um norte em relação a Flux/Redux, pois quero utiliza-los. Não vou conseguir esperar as aulas do curso saírem (o que eu queria MUITO!) mas não vou conseguir, infelizmente. Tem algum lugar que você me indica ver/ler/estudar sobre esse assunto ? Todos vídeos/artigos que vejo, me perco mais ainda, eu realmente preciso de um norte em relação a esse assunto. Você consegue me ajudar? Mesmo "não estando na hora", digamos assim !?
Valeu por toda atenção!
M2#A34 - Publicando em "Produção"
Boa tarde @fdaciuk, beleza?
1 - Como uma forma de testar o bundle de produção que geramos gerado, criei um repositório separado para o github-app no meu GH e gerei uma GitHub Page. Porém, está dando 404.
Será que pode ser algum problema no webpack? Ou é na Github Page mesmo? Não sei o que fiz de errado, porém também não sei se essa é uma forma boa e eficaz de realizar esse teste.
Repositório: https://github.com/gabrielferreiraa/github-app
2 - Colocando isso no webpack:
new htmlPlugin({
title: 'GitHub App',
template: path.join(__dirname, 'src', 'html', 'template.html')
})
Ao invés de buscar um index.html
na raiz ele busca o que está em src/html
? Não compreendi mt bem essa parte.
3 - Uma outra dúvida que me surgiu após essa aula, com minificação (uglify), e geração de bundle, é como irei utilizar o pré processadores CSS por exemplo. Ou um autoprefixer no gulp, enfim. Uma coisa que faz parte do nosso dia dia, agora com apenas 1 arquivo css/js para toda a aplicação.
Abraço!
M1#A48 - formas de fazer “bind” do this em eventos
Fala @fdaciuk, beleza?
Fiquei com dúvida sobre a diferença entre os binds do método handleSearch e getRepos. Porque não precisamos fazer o bind no constructor para o getRepos?
Porque o método getRepos é executado logo que a pagina é carregada e o método handleSearch não?
Se eu remover a arrow function ( return (e) => { ) do método getRepos, o que muda no bind deste método?
Estou no começo o curso agora e tendo o meu primeiro contato com o React, então desculpe se estou escrevendo alguma bobagem.....
Teste componente node
Eae @fdaciuk ,
Estou com um duvida um tanto inciante, mas estou me quebrando um pouco.
Qual é a forma correta de utilizar lib's externas em componentes? Estou fazendo umas testes com uma lib de node qualquer e ocorre um erro na renderização do componente, consegue me ajudar?
Segue o fonte:
https://github.com/RodrigoWP/learning-react/blob/master/src/app.js
M2#A52 - Problema no `yarn test:watch`
Boa tarde cara, beleza ? Faz um tempo que não apareço por aqui rs
Então, estava configurando o ambiente de testes e linter. Funcionou tudo perfeitamente, porém, não sei por qual motivo o yarn test:watch
não funciona, o yarn test
sem watch funciona normalmente !!
Da uma olhada no package.json
, não achei nada de errado :/
https://github.com/gabrielferreiraa/starterKitReact/blob/master/package.json
[m01] Estrutura githubapp
Em relação a estrutura criada no githubapp, por favor me corrija se eu estiver errado..
Criamos um componente container que é nosso AppContent, o único componente statefull da nossa aplicação, certo?!
Seguindo essa estrutura se eu fosse criar um aplicativo maior eu poderia dividir dessa forma:
src
app.js
index.js
menu1
components
AppContainer.js
menu2
components
AppContainer.js
O que eu quis dizer: Em um sistema maior eu vou ter vários containers, cada menu (ou aba) seria um container e todos esses containers ficaram dentro de um container principal que é o que seria renderizado no app.js, dessa forma eu teria o controle centralizado do estado de cada parte do sistema..
Não sei se fui claro, mas é isso ai?
[Dúvida] Erro preLoader
Boa noite de novo cara, estou na parte de instalar o standard como lint do meu boilerplate, mas esta dando um erro parece que com o preLoader, segue:
WebpackOptionsValidationError: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
configuration.module has an unknown property 'preLoaders'. These properties are valid:
object { exprContextCritical?, exprContextRecursive?, exprContextRegExp?, exprContextRequest?, loaders?, noParse?, rules?, unknownContextCritical?, unknownContextRecursive?, unknownContextRegExp?, unknownContextRequest?, unsafeCache?, wrappedContextCritical?, wrappedContextRecursive?, wrappedContextRegExp?, strictExportPresence?, strictThisContextOnImports? }
Fiz tudo direitinho como foi passado no vídeo, porem não roda o bundle de jeito algum, meu código está em:
Dúvida sobre Curso de React
Fala @fdaciuk, beleza? Estava pensando em comprar esse curso porém esta dando como ESGOTADO. Já era? Como funciona isso ? Valeu, abraço!
Duvida rapida :D
Professor, pelo que eu vi o modulo 4 ainda esta pra lançar, queira saber se vai haver um pouco de react fiber e se o modulo 4 vai ser grande como o modulo 2 ? ou vai ser surpresa ? 👍
MRW#05 - React.createClass is deprecated
Professor ao fazer essa aula eu me deparo com um warning dizendo que createClass do React, vai ser decrepitado a partir da versão 16, posso continuar o curso normalmente ? nas próximas aulas vai ser atualizado essa questão ou não devo me preocupar com isso ?
Arrow function vs bind
Fala @fdaciuk, tudo certo?
Primeiramente gostaria de te parabenizar pelo conteúdo do curso, ficou muito bom, curti demais! :D
Fiquei com uma dúvida na hora de resolver o exercício.
Criei a seguinte função:
handlePublicReposSearch () {
const login = this.state.userInfo.login
}
De início tentei chamá-la com:
handlePublicReposSearch={this.handlePublicReposSearch()}
Mas não funcionou, pois assim eu "perco" o this
do componente.
Então cheguei em duas saídas:
handlePublicReposSearch={() => this.handlePublicReposSearch()}
Ou
handlePublicReposSearch={this.handlePublicReposSearch.bind(this)}
Por enquanto estou preferindo utilizar arrow function. Você tem alguma recomendação sobre isso? Qual seria a melhor prática?
Valeu! :)
M1#A11- Interpolação
Tem dois tipos de interpolação:
<h1>Olá {this.props.name + ' ' + this.props.lastname}!</h1>
<h1>{`${this.props.name} ${this.props.lastname}`}!</h1>
mas por prática de ruby eu fiz assim:
<h1>{this.props.name} {this.props.lastname}!</h1>
e funcionou, a diferença delas está somente na escrita? porque essa última me pareceu mais agradável.
[M1A01] - Sobre os títulos.
@fdaciuk seria interessante, após o título de Modulo e EP. colocar o nome da aula. Algo como "M1#A01 - Ementa do Curso".
Parabéns pelo conteúdo.
React + Webpack #10
@fdaciuk, estou seguindo os vídeos e reproduzindo os exemplos da forma mais fiel possível. Entretanto, na aula 10 da configuração do Webpack, ao adicionar o standard no preLoader ocorre o erro conforme imagem abaixo. Parece ser algum erro no pacote do Webpack mesmo ou será que fiz algo errado?
O link para o código está aqui.
P.S.: esse Webpack é chato, hein! 😝
Dúvida sobre Estado da Aplicação
Boa noite @fdaciuk, tudo certo ? Vou tentar te expor um código que fiz e pedir umas dicas pra você. Pode ser?
O que eu quis tentar fazer é aquele esquema de Input Search Real Time em Tabela, sabe ? E CONSEGUI !
Primeiramente coloquei tudo em uma só classe, a tabela, o input search, tudo misturado.. depois pensei, porque não crio um componente desse input search, passo umas props
e posso utilizar ele em outros lugares. Resumindo, criei um component com esse input search, esse aqui. (algumas funções nesse arquivo como getInitialState
e searchUpdated
estão na documentação desse pacote)
Ele recebe umas props, como: data
(array de objetos com as informações da tabela), função de callback, e umas outras não muito importantes. p/ a ocasião.
Criei funções getters
e setters
. Quando dou change no input, a lib importada faz seu trabalho e me retorna o array de objetos filtrado, e jogo isso no setEntityResult
para ele guardar em uma variavel. Dentro da função searchUpdated
(que está no onChange
), eu chamo a função de callback passando como parametro o a função getEntityResult
.
Na função de callback que está no componente da tabela, eu dou um setState
com o resultado que recebi, e como o map
da minha tabela está ouvindo de this.state
ele atualiza a tabela.
Fiquei bem feliz de conseguir fazer isso funcionar 🥇 Porém como sou bem encucado, fico pensando, isso foi coisa mirabolante da minha cabeça? Esse "fluxo" que fiz... Fiz da melhor forma? Fiz da forma mais performática? Posso replicar esse fluxo de mudança de estado para o resto da minha aplicação ? Tenho medo disso virar uma salada de callbacks e props quando a aplicação crescer, não tenho ideia ainda hahah.
Gostaria de umas dicas em relação a esse esquema que fiz, caso você não tenha entendido da forma que expliquei me da um toque.
Valeu por toda ajuda!
M2#A50 - Dúvida sobre yarn
Fala @fdaciuk, beleza?
Só uma pequena dúvida de um cenário que eu passei aqui.
Vi no vídeo, quando você instalou o as dependencias para test com o comando: yarn add --dev jest-cli babel-jest chai
o yarn foi super eficaz e trabalhou em cima da instalação desses 3 pacotes !
Porém, no meu computador, ele demorou cerca de uns 5~10minutos, pois tive a impressão que ele passou atualizando todas dependências que tenho no package.json. Normal isso? Será que tem a ver com o Sistema Operacional ? Valeu
Dúvida em relação ao curso
@fdaciuk, cá estou novamente. Não para dúvida, mas por curiosidade!
Estudando junto com você, e ao mesmo tempo buscando novos conteúdos na internet, posso ver a citação de várias tecnologias e pensamentos que acompanham o React e trabalham junto com ele, são eles os principais: Flux e Redux. Estou na aula M1#A50 até o momento isso não foi abordado. Alguma das aulas que estão no ar, explicam o que são esses conceitos/tecnologias? Pesquiso, pesquiso e pesquiso porém, não acho ninguém didático o suficiente para me explicar e me ajudar em relação a isso. Consegue me dar uma mão?
Desculpe a "abrissão" de issues, é que esse React tem mta coisa pra aprender hehehehe
Abraço!
Dúvidas
Fala @fdaciuk, cá estou eu novamente. Algumas dúvidas rápidas creio eu, vou colocar em forma de lista.
-
No
webpack.config
na parte deoutput
emPublicPath
, você fala sobre trabalhar com arquivos em memória, e seta um/static/
. Mas não entendi muito bem esse esquema, vou realmente poder usar assim? Não vou chamar obundle.js
pela url normal? Como funciona quando trabalho com 2 ambientes (dev/produção) ? -
Estou na aula 27 ainda. Mas algumas coisas me preocupam. Com essa estrutura do React, onClick (eventos) inline, e outras coisas a mais que vi até o momento (nada aprofundado). É realmente assim? Não consigo me imaginar estruturando uma aplicação toda dessa maneira, com eventos inline, html dentro de arquivos javascript. O React realmente trabalha dessa forma, ou até o momento você está fazendo assim apenas para motivos de aprendizado?
Resumindo, não consigo pensar em uma aplicação estruturada em react, com essa estrutura apresentada até o momento.
[OFF] Dúvida sobre Material Design
@fdaciuk, só uma dúvida meio em OFF ao curso.
O intuito de estar fazendo este curso é que vou precisar desenvolver uma aplicação grande (Painel Administrativo) em breve. E decidi fazer em React !
Estava bem preocupado com a questão de layout, como estou usando JSX, vou me perder um pouco para usar folhas de estilo e tudo mais. Dei uma breve pesquisada e acabei caindo aqui: Material UI. Essa seria uma boa alternativa para desenvolvimento? Pois eu vi que tem bastante coisa legal e "pronta". Gostaria que me falasse mais sobre esses Material Designs do React, o que você recomenda e tudo mais.
M2#A37 - Duvida
Fala @fdaciuk, tudo certo?
Configurei o CSS Modules aqui, seguindo a aula etc. Em ambiente de DEV, deu tudo certo! Porém ao gerar o bundle de produção, ele gera com as classes normais do CSS. Como eu faria para gerar o hashs nas classes em produção também? Ou isso não é uma boa prática?
M1#A13 - Babel React Preset
Oi pessoal, quando instalei o babel-react-preset
e adicionei react
no array de presets do .babelrc, meu projeto passou a dar esse erro de compilação:
ERROR in multi (webpack)-dev-server/client?http://localhost:8080 ./src/index
Module not found: Error: Can't resolve 'babel' in '/Users/camilaibs/Desktop/curso-react-ninja'
BREAKING CHANGE: It's no longer allowed to omit the '-loader' suffix when using loaders.
You need to specify 'babel-loader' instead of 'babel',
see https://webpack.js.org/guides/migrating/#automatic-loader-module-name-extension-removed
@ multi (webpack)-dev-server/client?http://localhost:8080 ./src/index
Dai troquei o loader de babel
para babel-loader
no webpack.config.js e voltou a funcionar, aconteceu isso com vocês, entendi certo o que era para fazer na mensagem de erro?
M2#A51 - Dúvida lint e lint-fix.
Volteeeeeeeeeeeeeeeeei @fdaciuk hahaha
Viu, no começo do curso, optei por utilizar o semistandard ao inves do standard. E estou passando por alguns cenários.
Exemplo: Ele fala o seguinte no lint:
1º "Value must be omitted for boolean attributes".
O que dá a entender é, meu código está assim: open={true}
porém o lint fala que posso deixar assim: open=true
, mas se eu deixo assim como ele fala, da erro !
Mesma situação acontece quando usamos !!
para transformar em valor booleano, ele fala: "Redundant double negation".
Entre outros.. estou com medo de rodar um semistandard --fix e ele acabar quebrando minha aplicação.
Como devo submeter?
Dúvidas gerais
Fala @fdaciuk, beleza? Lá vai as perguntas rs
1 - Meu carma, autenticação. Não cheguei a colocar a mão na massa em relação a isso ainda, só pesquisei, acabei caindo aqui. É mais ou menos esse fluxo que preciso seguir (apenas de não estar tão claro pra mim esse auth-flow), tem algum lugar que posso me basear?
2 - Vamos pensar em um "editar usuário", que usa o mesmo arquivo de formulário "criar usuário" por exemplo, isso pode ser uma boa prática ou má prática? Ainda não consigo desenhar na minha cabeça o fluxo de CRUD em React editando/deletando. Pode me dar uns toques em relação a formulários nesse sentido? Trabalho com o <form>
normal ? Pegando os dados com JS Puro para enviar pra API.
Valeu por toda força!
Dúvidas Standard e Lints
Boa tarde @fdaciuk , beleza? Uma dúvida bem rápida. O uso do standard como preLoader, elimina a necessidade de usar ponto e virgula em toda minha aplicação? Pois estou com algumas mensagens de error de semicolon, creio que seja por conta do ponto e vírgula. Existe algum parâmetro para ele ignorar isso? Pois prefiro trabalhar com ponto e vírgula. Ou procuro outro lint? Valeu!
M1#A12
@fdaciuk, duas questões sobre a short-hand notation:
-
Há algum ganho de performance na aplicação pelo fato de conseguirmos importar uma parte de um todo, como feito com { Component } na aula 12 do módulo 1?
-
O espaço após a abertura e antes do fechamento das chaves é obrigatório ou apenas uma convenção?
Dúvida sobre lifecycle
Opa @fdaciuk, beleza?
Algumas perguntas.
Quando vou trabalhar com consumo de API, por exemplo uma tabela (sem nenhuma ação), quando o usuário chama a rota, eu consumo e renderizo a tabela. Posso trabalhar com lifecycle? Fazer o ajax no componentWillMount()
e setar o estado por exemplo? Ou tem algum pattern que é bom seguir?
Valeu!
Problema pra concatenar propriedades
Quais plugins você usa no Vim?
[m01] Githubapp
Boa tarde @fdaciuk
Dúvida, no projeto githubapp eu vi que você criou um styles.css no diretorio dist, mas no webpack.config não tem nenhuma saída pra css.. é isso mesmo? Ele não será sobre escrito ao gerar o bundle?
Valeu!
M1#A45 - Duvidas sobre os eventos do React
Uma duvida rápida, no caso como foi explicado na aula, se eu usar "evento" que é emitido pelo onKeyUp, ele só vai deixar null as propriedades quando eu fizer uso desse "evento", em uma função assíncrona ?, ou sempre ao finalizar o callback, ele faz as propriedades ficarem null ?, porque na aula foi possível guardar e.target em uma constante, pra depois ser usada no método always, ai sim ele foi mudado pra null. em resumo só dá uma re explicação rápida pois não ficou muito claro pra min :)
M2#A43 - Problema com storybook
@fdaciuk, da esse erro ao rodar getstorybook
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.