Read on Twitter
When I released the rewrite of my "The Road to React"-book, I published it on my very new course website 
https://courses.robinwieruch.de Super proud of the result!
For anyone who is interested, I want to share what went into this new website
1/n https://twitter.com/rwieruch/status/1237769938267525122
https://courses.robinwieruch.de Super proud of the result!For anyone who is interested, I want to share what went into this new website
1/n https://twitter.com/rwieruch/status/1237769938267525122
Previously https://www.roadtoreact.com was the entire course website. Now it's only the landing page built with @gatsbyjs which shares the same theme with my personal website https://www.robinwieruch.de This applies to all my other course landing pages as well.
2/n
https://www.robinwieruch.de This applies to all my other course landing pages as well.2/n
My new course website https://courses.robinwieruch.de started as open source project and still is open source. I think it's a great example showing the dynamics of a growing tech stack:
NextJs by @zeithq
GraphQL with @apollographql
Firebase
TS
3/n https://twitter.com/rwieruch/status/1217469031550259200
NextJs by @zeithq GraphQL with @apollographql Firebase TS3/n https://twitter.com/rwieruch/status/1217469031550259200
Just cloning the project doesn't suffice anymore, because there are a few moving parts:
Stripe
PayPal
Coupons
Firebase Auth & DB
S3 for File Storage
Sentry Tracking
Automated Slack Invite
..
Trying to keep everything documented in the README though.
4/n
Stripe PayPal Coupons Firebase Auth & DB S3 for File Storage Sentry Tracking Automated Slack Invite ..Trying to keep everything documented in the README though.
4/n
The entire authentication is powered by @firebase It's just amazing how all the essentials are covered by it.
Sign Up
Sign In
Sign Out
Password Reset
Password Change
Email Change
Firebase is used on Next server-side though.
5/n
Sign Up Sign In Sign Out Password Reset Password Change Email ChangeFirebase is used on Next server-side though.
5/n
Why Firebase on the server-side?
1) Lightweight client
2) Authorization on a GraphQL level
3) Makes potential migration to PostgreSQL easier
Essentially that's https://firebase.google.com/docs/auth/admin/manage-cookies the guide I followed to get FB from client to server.
Rel. PR: https://github.com/rwieruch/nextjs-firebase-authentication/commit/5df46ad4e4a11470153244396c22db3a1580c628
6/n
1) Lightweight client
2) Authorization on a GraphQL level
3) Makes potential migration to PostgreSQL easier
Essentially that's https://firebase.google.com/docs/auth/admin/manage-cookies the guide I followed to get FB from client to server.
Rel. PR: https://github.com/rwieruch/nextjs-firebase-authentication/commit/5df46ad4e4a11470153244396c22db3a1580c628
6/n
On the Next.js server-side I use Apollo Server by @apollographql with Micro by ZEIT. It's the first time I used Micro: Everything works as expected, but it can become a burden if you hit a problem and can't find the solution to it, because it isn't super widely used yet.
7/n
7/n
Apollo Server goes with the schema-first approach. Which is fine until you want to introduce TS. When I eventually decided to go with TS, it still worked out with GraphQL Code Generator.
8/n https://graphql-code-generator.com/
8/n https://graphql-code-generator.com/
GraphQL Code Generator turned out to be a blessing once it had been set up properly. All types for backend and frontend are generated on the fly.
I had no chance to check out TypeGraphQL yet. What do you think about it?
CC @benawad
9/n
I had no chance to check out TypeGraphQL yet. What do you think about it?
CC @benawad
9/n
A few days ago I introduced PostgreSQL with TypeORM powered by @digitalocean as replacement for Firebase DB. I migrated all data over and I am keeping the data in sync with both DBs for now. The next week will show whether I stick to FB or PostgreSQL.
10/n
10/n
PostgreSQL
TS support with TypeORM
no FB lock-in
career-wise better to know SQL than FB queries
SQL > NoSQL
https://twitter.com/rwieruch/status/1242735242512928768
Firebase
Still using it for Auth...
I guess FB can be used like a SQL if hierarchies are kept flat with foreign keys
11/n
TS support with TypeORM no FB lock-in career-wise better to know SQL than FB queries SQL > NoSQL https://twitter.com/rwieruch/status/1242735242512928768Firebase
Still using it for Auth... I guess FB can be used like a SQL if hierarchies are kept flat with foreign keys11/n
In terms of authorization I use graphql-shield instead of graphql-resolvers with combineResolvers.
Generally I dont like the indirection graphql-shield introduces. But it integrated nicely into my GraphQL TS code. What's your opinion here?
Rel. PR: https://github.com/rwieruch/nextjs-firebase-authentication/commit/f90e2233a99807410b90d5a256d200b519946a6d
12/n
Generally I dont like the indirection graphql-shield introduces. But it integrated nicely into my GraphQL TS code. What's your opinion here?
Rel. PR: https://github.com/rwieruch/nextjs-firebase-authentication/commit/f90e2233a99807410b90d5a256d200b519946a6d
12/n
All file downloads, in my case book downloads, go through NextJS API with GraphQL to @digitalocean Spaces. If you have used AWS S3 before, you will recognize the API.
13/n
13/n
The React application uses @AntDesignUI It's the 1. time I am using it and so far I can only recommend it. Previously I've used Material UI and Semantic UI.
Still wanted to check out Chakra UI, because @thekitze is raving about it!
Didn't optimize for mobile yet
14/n
Still wanted to check out Chakra UI, because @thekitze is raving about it!
Didn't optimize for mobile yet
14/n
All my courses complement the books I am writing about React and other tech stacks. There is a great landscape of video courses, but not so much material for people learning with books. I want to close this gap with this website which eventually opens up for more authors.
15/n
15/n
MDX (it's awesome!) is already used on my website https://www.robinwieruch.de and now I am using it with prism-react-renderer for the online book reading experience too.
An internal script helps me keeping book files (PDF etc.) and markdown in sync.
16/n
An internal script helps me keeping book files (PDF etc.) and markdown in sync.
16/n
There are 3 bundles for each book:
Bare Essentials: Book as PDF, EPUB, MOBI
Essentials: + Book in Website
Professional: + Lots of extra tutorials.
If you decide for a smaller bundle, it's now possible to upgrade the bundle later.
17/n
Bare Essentials: Book as PDF, EPUB, MOBI Essentials: + Book in Website Professional: + Lots of extra tutorials.If you decide for a smaller bundle, it's now possible to upgrade the bundle later.
17/n
The buying flow is done in 2 steps:
1) If you don't have an account, it asks you to sign in. If you are already signed in, you start at 2).
2) Payment with Stripe or PayPal.
Thoughts about the buying flow in next tweets
18/n
1) If you don't have an account, it asks you to sign in. If you are already signed in, you start at 2).
2) Payment with Stripe or PayPal.
Thoughts about the buying flow in next tweets
18/n
Thoughts
Step 2 without 1 would improve the conversation rate, but it seemed too much code hassle for now.
I had PayPal on pause for 6 months. After enabling it, sales went up.
Coupon for PPP https://purchasing-power-parity.com to support countries with weak currencies.
19/n
Step 2 without 1 would improve the conversation rate, but it seemed too much code hassle for now. I had PayPal on pause for 6 months. After enabling it, sales went up. Coupon for PPP https://purchasing-power-parity.com to support countries with weak currencies.19/n
Thoughts continued...
PayPal sale happens on-site, Stripe (Checkout) on a separate website. Not sure if conversation rate for Stripe would increase if it would be kept on-site too.
20/n
PayPal sale happens on-site, Stripe (Checkout) on a separate website. Not sure if conversation rate for Stripe would increase if it would be kept on-site too.20/n
Why NextJs?
1) I'm hugely inspired by ppl like @wesbos and @stolinski who run their platforms with NextJs these days. Since I am most familiar with React, NextJs was the the choice for me as well.
21/n
1) I'm hugely inspired by ppl like @wesbos and @stolinski who run their platforms with NextJs these days. Since I am most familiar with React, NextJs was the the choice for me as well.
21/n
Why NextJs?
2) Historically I moved from (A) clearly separated client-server architectures, short term over to (B) Next with microservices, over to (C) _only_ Next with API.
A) still valid option
B) managing Microservices felt brittle as solo dev
C) everything at 1 place!
22/n
2) Historically I moved from (A) clearly separated client-server architectures, short term over to (B) Next with microservices, over to (C) _only_ Next with API.
A) still valid option
B) managing Microservices felt brittle as solo dev
C) everything at 1 place!
22/n
Now I've a few independent landing pages powered by @gatsbyjs for every book; which all share a theme.
Every landing page points to my course website which manages the rest.
Hugely inspired by @wesbos and his
Bos Monster! 
23/n
Every landing page points to my course website which manages the rest.
Hugely inspired by @wesbos and his
Bos Monster! 23/n
Landing pages, course website, personal website and a few other APIs powering the platform are all running on one @digitalocean Droplet.
For most of them I've set up staging servers and automated deploys. Lots of little work
Outdated read: https://www.robinwieruch.de/deploy-applications-digital-ocean
24/n
For most of them I've set up staging servers and automated deploys. Lots of little work
Outdated read: https://www.robinwieruch.de/deploy-applications-digital-ocean
24/n
I will keep you up-to-date with new changes in this thread. Lots of features to come!
If you have any questions, opinions or suggestions, I'd love to hear them
I hope you liked this summary of what went into all of this 
25/n
If you have any questions, opinions or suggestions, I'd love to hear them
I hope you liked this summary of what went into all of this 25/n
Today I finished the partner program
Partners can send referral links and earn a commission.
Partners can track their
* referral link clicks (visitors)
* sales
* monthly payments
Online: https://courses.robinwieruch.de/partner
Rel. PR: https://github.com/rwieruch/nextjs-firebase-authentication/pull/77
26/n
Partners can send referral links and earn a commission.
Partners can track their
* referral link clicks (visitors)
* sales
* monthly payments
Online: https://courses.robinwieruch.de/partner
Rel. PR: https://github.com/rwieruch/nextjs-firebase-authentication/pull/77
26/n
Lots of people asked me about student discounts: Now I am able to create coupons for them Handed out more than 30 today!
If you are a student or a teacher with students, ask me about the discount and I will hand them out
Rel. PR: https://github.com/rwieruch/nextjs-firebase-authentication/pull/78
27/n
Handed out more than 30 today!If you are a student or a teacher with students, ask me about the discount and I will hand them out
Rel. PR: https://github.com/rwieruch/nextjs-firebase-authentication/pull/78
27/n
