Merge branch 'release'

web/blog/2023-06-22-wasp-launch-week-three.md

@@ -0,0 +1,143 @@
+---
+title: 'Wasp Launch Week #3: Magic'
+authors: [matijasos]
+image: /img/lw3/lw3-banner.png
+tags: [launch-week, update]
+---
+
+import Link from '@docusaurus/Link';
+import useBaseUrl from '@docusaurus/useBaseUrl';
+
+import InBlogCta from './components/InBlogCta';
+import WaspIntro from './_wasp-intro.md';
+import ImgWithCaption from './components/ImgWithCaption'
+
+<ImgWithCaption
+    alt="Launch Week 3 is coming"
+    source="img/lw3/lw3-banner.png"
+/>
+
+By now, it is a tradition. For the every upcoming launch week, we ask ourselves how can we top the last one? How can we make building full-stack web apps easier, more enjoyable and get rid of even more boilerplate?
+
+If this is the first time you're joining, check our previous launches:
+- [Launch Week 1: Beta](/blog/2022/11/26/wasp-beta-launch-week)
+- [Launch Week 2: Pizzazz](/blog/2023/04/11/wasp-launch-week-two)
+
+Our first launch week was about making the promise of Wasp Alpha a reality, so you can build what you envisioned and deploy your app to production. The second launch made the whole experience much more polished, getting closer to the DX you'd expect from a mature web framework.
+
+## Why Magic?
+
+For this launch, with all the basics in place and [you having built thousands of apps with Wasp](/blog/2023/01/31/wasp-beta-launch-review) (thank you!), **we started pushing the boundaries of what web frameworks can do**, utilising Wasp's unique DSL/compiler approach. This is still barely scratching the surface, but you'll be able to try it out yourself and get a taste of what the future of web development will look like.
+
+<ImgWithCaption
+    alt="Magic - LW3 in a nutshell"
+    source="img/lw3/magic.gif"
+    caption="This launch week in a nutshell."
+/>
+
+
+## What's coming 🐝
+
+Every day next week, starting Monday, June 26, we'll highlight a major new feature in Wasp. We'll update this post daily as we reveal each feature, so make sure to keep coming back! Follow us on twitter ([@wasplang](https://twitter.com/WaspLang)) to stay in the loop and also [join our Discord](https://discord.gg/rzdnErX) to join the community and get help as you're trying Wasp out.
+
+
+## Launch party 🚀🎉
+
+<ImgWithCaption
+    alt="launch event 2 - screenshot"
+    source="img/lw3/lw2-event-screenshot.png"
+    caption="A bit of the atmosphere from our last launch party"
+/>
+
+What would a launch be without a proper event and a party? A boring, heartless event, that's what!
+
+That's why we'll get together to celebrate the launch, our community (you!) and all the hard work that's been put into this new, fresh edition of Wasp. You will also get to meet the team and hear first-hand from the makers about the latest features and plans for the future.
+
+The party starts at **9.30 am EDT / 3.30 pm CET** - sign up [here](https://discord.gg/p7TzVUn2?event=1121156549080002680) and make sure to mark yourself as "interested"!
+
+<ImgWithCaption
+    alt="launch event - how to join"
+    source="img/lw3/lw-event-how-to-join.png"
+/>
+
+As per usual, there will be memes, swag and lots of interesting dev discussions!
+
+## Monday: The future is now 🛸
+
+<ImgWithCaption
+    alt="The future is now"
+    source="img/lw3/future-is-now.gif"
+/>
+
+We'll immediately kick things off with a bang! What's the one thing that all developers universally agree is something they'd like to do less of? Writing boilerplate CRUD logic, of course! Yet, it's 2023 and the best we managed to do is get an AI write it half-correctly for us and we still have to maintain it.
+
+That's what we are coming after - is it possible to avoid writing (or generating) CRUD code in the first place? How far can we take it and what's then even left for your to code? Join us on Monday and find out!
+
+**When**: Monday, June 26 2023
+
+**Read more about it**: coming soon
+
+## Tuesday: Be real, time 🔌⏱
+
+<ImgWithCaption
+    alt="Realtime"
+    source="img/lw3/realtime.jpg"
+/>
+
+Sometimes, you just want to keep it real. Especially when you are dealing with time. I've been dropping some hints here - have you figured out what is this about? If yes, drop us a line on twitter ([@wasplang](https://twitter.com/WaspLang)) and the first one to get it right will get a special (real and timely) award!
+
+Another situation where you might want to keep things real is when chatting to someone, especially via the text (*wink wink hint hint 🧦*).
+
+**When**: Tuesday, June 27 2023
+
+**Read more about it**: coming soon
+
+## Wednesday: Community Day 🤗
+
+<ImgWithCaption
+    alt="Community"
+    source="img/lw3/hug.gif"
+    caption="Just let it all out"
+/>
+
+Community is at the centre of Wasp, and Wednesday is at the centre of the week, so it's only appropriate to marry the two together. We'll spotlight the amazing OSS tools Wasp is built on top of and also you - all the cool stuff you have built with Wasp and how you're contributing every day to make our community better!
+
+**When**: Wednesday, June 28 2023
+
+**Read more about it**: coming soon
+
+## Thursday: Take care of your tools 🛠
+
+<ImgWithCaption
+    alt="Tools"
+    source="img/lw3/tools.gif"
+/>
+
+It's a well known fact that a developer is only as good as the tools they are using. That actually applies to anybody - if Gimli hadn't spent time sharpening his axe, he wouldn't stand a chance against these orcs, would he?
+
+Us at Wasp, we are pretty much the same as Gimli - we take our tools seriously. As we are innovating on the framework features, our goal is to do the same with the tooling you use with Wasp. Get ready to get your hands dirty (with code).
+
+**When**: Thursday, June 29 2023
+
+**Read more about it**: coming soon
+
+## Friday: Waspularity 🤖 + Tutorial-o-thon!
+
+<ImgWithCaption
+    alt="Waspularity"
+    source="img/lw3/waspularity.png"
+/>
+
+For the final day of the launch week, we have a really cool surprise for you. I'll just say it's something like Matrix but the robots are your friends and there's no that weird guy with sunglasses to ruin everything. And there might be cake.
+
+To wrap the week up, we'll also start another hackathon, but this time in a bit different format. Since the best way to learn something is to teach it to others, we'll focus on tutorials this time! May the best tutorial win - more info coming soon.
+
+**When**: Friday, June 30 2023
+
+**Read more about it**: coming soon
+
+## Recap
+
+- **We are kicking off Launch Week #3 on Mon, June 26, at 9.30am EDT / 3.30pm CET** - make sure to [register for the event](https://discord.gg/p7TzVUn2?event=1121156549080002680)!
+- **Launch Week #3 brings a ton of new exciting features** - we’ll highlight one each day, starting Monday. Follow us on [twitter](https://twitter.com/WaspLang) and [join our Discord](https://discord.gg/rzdnErX) to stay in the loop!
+- **Following launch week, we’ll announce a tutorial-o-thon** - get your writing gear ready!

web/docs/deploying.md

@@ -32,12 +32,14 @@ In the above commands, we used an app basename of `my-wasp-app` and deployed it
 - `my-wasp-app-server`
 - `my-wasp-app-db`
 
-:::caution
+:::tip Unique Name
 Your app name must be unique across all of Fly or deployment will fail. Additionally, please do not CTRL-C or exit your terminal as these commands run.
 :::
 
-:::note
-Fly has  [free allowances](https://fly.io/docs/about/pricing/#free-allowances) for up to 3 VMs. If you already have some apps deployed on their free Hobby Plan, you will need to add your credit card info before proceeding.
+:::caution A Note on Free Tiers 💳
+Fly has [free allowances](https://fly.io/docs/about/pricing/#plans) for up to 3 VMs (so deploying a Wasp app to a fresh account is free), but all plans require you to add your credit card info before proceeding. If you don't, the deploy will fail!
+
+To do so, go to your [account's billing page](https://fly.io/dashboard/personal/billing).
 :::
 
 The list of available Fly regions can be found [here](https://fly.io/docs/reference/regions/). You can also run `wasp deploy fly cmd platform regions --context server`.
@@ -367,16 +369,100 @@ NOTE: Make sure you set this URL as the `WASP_WEB_CLIENT_URL` environment variab
 
 ## Deploying to Railway ("freemium", all-in-one solution)
 
-Railway makes it easy to deploy your entire app -- database, server, and client -- on one platform. You can use the platform for free for a limited time (~21 days) per month. Upgrading to the `Developer` plan will only cost you a few dollays per month per service.
+Railway is a simple and great way to host your server and database. It's also possible to deploy your entire app -- database, server, and client. You can use the platform for free for a limited time, or if you meet certain eligibility requirements. See their [plans page](https://docs.railway.app/reference/plans) for more info.
 
-:::danger 🛑
-  Due to Railway's current proxy configuration, Google Auth will not currently work. If you're using Google Auth in your Wasp App, you can still deploy your back-end to Railway, but we suggest you [deploy your front-end to Netlify](#deploying-to-netlify)
+:::caution ✋
+  Due to Railway's current proxy configuration, client-side routing will not work correctly without some additional configuration, which is described in the toggle below. 
+  
+  If you prefer NOT to configure your client for Railway, another option is to deploy only your back-end there, while deploying your client to a seperate service such as [Netlify](#deploying-to-netlify)
+
+  <details>
+    <summary>
+      <em>Additional Configuration for Client-Side Routing</em>
+    </summary>
+    <div>
+
+1. Ensure your Wasp project is built by running `wasp build` in the project dir.
+2. Go to `/.wasp/build/web-app` and create 2 files:
+
+- Dockerfile: simply create a file named `Dockerfile` with the contents below (note, it's important to use `FROM nginx:1.19.10-alpine`, as using anything other than this version may throw a lot of exceptions on the server):
+```dockerfile
+FROM node:18-alpine AS builder
+
+# Examples of any ENV variables that build requires for react app to have
+ARG PORT
+ARG WASP_WEB_CLIENT_URL
+ARG REACT_APP_API_URL
+ARG API_URL
+
+ENV REACT_APP_PORT=$PORT
+ENV REACT_APP_WASP_WEB_CLIENT_URL=$WASP_WEB_CLIENT_URL
+ENV REACT_APP_API_URL=$REACT_APP_API_URL
+
+# Add a work directory
+WORKDIR /app
+
+COPY package.json .
+
+RUN npm install
+
+COPY . /app/
+
+RUN npm run build
+
+FROM nginx:1.19.10-alpine
+
+# Set working directory to nginx asset directory
+WORKDIR /usr/share/nginx/html
+
+# Remove default nginx static assets
+RUN rm -rf ./*
+
+COPY --from=builder /app/build .
+
+COPY .nginx/nginx.conf /etc/nginx/conf.d/default.conf
+
+EXPOSE 3000
+
+ENTRYPOINT ["nginx", "-g", "daemon off;"]
+```
+- Create a file calle `.dockerignore` with the following contents:
+```
+node_modules
+```
+3. Create a new directory `/.nginx` inside the `web-app` dir.
+4. Create a file `nginx.conf` inside the `/.nginx` dir with the following contents:
+```
+server {
+   listen       8080;
+   server_name  localhost;
+
+   location / {
+       root   /usr/share/nginx/html;
+       index  index.html;
+       try_files $uri $uri/ /index.html;
+   }
+}
+```
+5. Make sure that the `client` service in Railway, which you will set up below, has env variable `PORT` set to `8080` (see the [Add Enviornment Variables](/docs/deploying#add-environment-variables) section below for more info).
+6. Optionally, you may need to disable `tsc` in the `/.wasp/build/web-app/package.json` file if Docker fails on deploy due to typing issues:
+```
+	"scripts": {
+		"start": "npm run validate-env && vite",
+		"build": "npm run validate-env && vite build",
+		"validate-env": "node -r dotenv/config ./scripts/validate-env.mjs"
+	},
+```
+7. Then continue to follow the instructions below to deploy your app to Railway.
+
+</div>
+  </details>
 :::
 
 To get started, follow these steps:
 
 1. [Generate deployable code](#generating-deployable-code) (`wasp build`)
-2. Sign up at [Railway.app](https://railway.app) (Tip! Sign up with your GitHub account for $5/month of usage free)
+2. Sign up at [Railway.app](https://railway.app) (Tip! Sign up with your GitHub account to be elligble for the free tier)
 3. Before creating a new project, install the [Railway CLI](#https://docs.railway.app/develop/cli#install) by running the following command in your terminal:
   ```shell
   curl -fsSL https://railway.app/install.sh | sh

web/src/components/Hero.js

@@ -38,7 +38,7 @@ const ActionButtons = () => (
         `}
       >
         <Terminal size={16} />
-        <span>{'wasp new <app>'}</span>
+        <span>{'Get Started'}</span>
       </button>
     </Link>
 
@@ -55,7 +55,7 @@ const ActionButtons = () => (
         `}
       >
         <BookOpen size={16} />
-        <span>Quick Guide</span>
+        <span>Documentation</span>
       </button>
     </Link>
   </div>

web/src/components/Nav/Announcement.js

@@ -9,7 +9,7 @@ const Announcement = () => {
   let history = useHistory();
 
   const handleLink = () => {
-    history.push('/blog/2023/05/19/hackathon-2-review')
+    history.push('/blog/2023/06/22/wasp-launch-week-three')
     //history.push('/#signup')
 
     //window.open('https://twitter.com/MatijaSosic/status/1646532181324603395')
@@ -39,7 +39,7 @@ const Announcement = () => {
         `}
       >
         <span className='item-center flex gap-2 px-3'>
-          <span>🏆 Wasp Hackathon 2.0 is Finished!</span>
+          <span>🔮 Wasp Launch Week #3: Jun 26 - 30</span>
         </span>
 
         <span className='hidden items-center space-x-2 px-3 lg:flex'>
@@ -49,7 +49,7 @@ const Announcement = () => {
               hover:bg-neutral-600
             `}
           >
-            Check Out the Winners 🎉
+            Learn more →
           </span>
         </span>
       </div>

web/src/components/Nav/index.js

@@ -232,7 +232,7 @@ const Nav = () => {
                       transition ease-out duration-200
                     `}
                   >
-                    {'wasp new <app>'}
+                    Get Started
                   </button>
                 </Link>