Razzle: Iniciando um novo aplicativo

Acho que todos concordariam que a resposta correta seria que isso depende do que você e seu novo projeto precisam.

Até onde eu sei, o Next.js é um framework completo que pode ser usado opcionalmente como parte do ecossistema ZEIT? ou plataforma?. Considerando que Razzle é muito mais minimalista. Portanto, ele não inclui recursos que você pode não precisar, mas também é verdade que ele não inclui recursos que você pode precisar ou poderá precisar eventualmente.

Eu também considerei usar o Next.js antes, mas havia alguns pequenos detalhes que eram irritantes para mim. Por exemplo, Next.js não reduz a saída HTML corretamente (eu sei que isso não é tão importante, mas isso foi um problema para mim). Ele também usa styled-jsx e CSS-in-JS, mas eu prefiro Styled Components . Além disso, para o meu novo projeto não precisei de roteamento (ainda 😄).

Finalmente e felizmente depois de testar vários projetos de exemplo, acabei encontrando e usando o Razzle. Na verdade, comecei com a criação de um projeto de exemplo chamado Razzle Material UI Styled Example , incluindo alguns módulos e recursos de que preciso. Então agora posso trabalhar no meu novo projeto quase descaradamente. Sinta-se à vontade para usar o repositório mencionado se precisar dos mesmos recursos ou de alguns deles.

Obrigado @knipferrc

Uma experiência semelhante me levou a criar Razzle.

Cerca de 6 meses atrás, eu iniciei um aplicativo enorme com o Next.js logo após o lançamento e o churn foi demais para mim. Eu literalmente enviei o PR para o exemplo de roteamento parametrizado (ou seja /user/:id ). Lembro que perdi uma semana inteira de trabalho por causa de um bug estranho relacionado ao disparo de getInitialProps em mudanças de rota . No final das contas, o Next.js toma muitas decisões muito importantes para você (ou seja, roteamento, busca de dados, estrutura de pastas e estilo). Se estes são bons ou ruins depende inteiramente do tipo de aplicativo que você está construindo. Como se viu, na verdade eu não precisava renderizar cada rota do servidor (apenas como 2), queria estados de carregamento do cliente em vez de recarregamentos de página inteira e não queria destruir a árvore de estado global entre as alterações de rota. Isso, juntamente com a minha opinião de que o React-Router 4 é a melhor coisa desde o pão fatiado, significava que o Next.js não era o ajuste certo para o projeto.

Procurando algo mais estável, mudei para o projeto kyt do NYT. Isso foi suficiente por cerca de 2 meses, mas 1) os tempos de compilação se tornaram insanamente lentos (> 45s) à medida que o aplicativo crescia, 2) as regras SCSS de kyt não eram adequadas para o projeto e 3) encontrei o registro de kyt (com a quantidade insana de emoji) muito chato. Então decidi começar a trabalhar em um substituto mais fino e rápido para o kyt, mas com HMR universal e uma API de configuração semelhante ao Next.js-- create-react-app-ssr , por assim dizer.

Depois que tudo foi dito e feito, percebi que havia criado um sistema de compilação quase agnóstico de estrutura e que esse nível de abstração era mais adequado para as necessidades do meu projeto. Por “framework-agnostic”, quero dizer que Razzle funcionará 100% com Angular, Vue, Rax, Preact, Inferno, React-XP, RN-Web, Reason-React e, o mais importante para mim, qualquer coisa maluca que venha a seguir. IMHO, Adaptabilidade é o principal diferencial entre Razzle e praticamente tudo o que eu já vi. Com o Razzle, você pode ler sobre algo em um post de blog, criar um fork, adicionar um sistema de compilação babel-transform/webpack config/parallel e apenas tentar shit . Por quê? Porque, ao contrário do Next, o Razzle não é um framework e, ao contrário do CRA, o Razzle permite que você aumente a configuração subjacente sem bifurcá-la. Isso é enorme para a maneira como eu aprendo, ensino, experimento e faço negócios.

A flexibilidade e o agnosticismo de Razzle já valeram a pena para mim e minha equipe:

• Movemos incrementalmente nosso aplicativo de parcialmente fluxo para 100% TypeScript alterando menos de 10 linhas de código em razzle.config.js .
• Sem sequer tentar, o Razzle se tornou a maneira mais rápida de inicializar um projeto ReasonReact (SSR ou SPA).

Quanto ao futuro de Razzle. Dois dias atrás, "adicionar suporte SSR ao CRA" foi mencionado como um dos 15 principais afazeres no roteiro da equipe do React Core. Se o suporte SSR for adicionado ao CRA, o Razzle pode não precisar mais existir..._e estou totalmente tranquilo com isso_. Até que isso aconteça, o Razzle avançará como uma ferramenta de construção independente de estrutura para JavaScript universal renderizado por servidor.

Uau!! Muito obrigado pessoal pelas respostas incríveis.

Oi Jared, não estou muito claro sobre como usar o Razzle para converter um projeto SPA Angular em SSR.
Você pode me dar uma dica ou guia sobre como fazer isso? Muito obrigado.

+1 para uma solução Razzle Angular. https://github.com/jaredpalmer/razzle/issues/1109