Skip to content

Commit

Permalink
Merge branch 'release'
Browse files Browse the repository at this point in the history
  • Loading branch information
infomiho committed Jun 23, 2023
2 parents c50aef3 + f2f5a98 commit 2db1dfa
Show file tree
Hide file tree
Showing 14 changed files with 242 additions and 13 deletions.
143 changes: 143 additions & 0 deletions web/blog/2023-06-22-wasp-launch-week-three.md
Original file line number Diff line number Diff line change
@@ -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!
100 changes: 93 additions & 7 deletions web/docs/deploying.md
Original file line number Diff line number Diff line change
Expand Up @@ -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`.
Expand Down Expand Up @@ -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.

:::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.

:::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)
</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
Expand Down
4 changes: 2 additions & 2 deletions web/src/components/Hero.js
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ const ActionButtons = () => (
`}
>
<Terminal size={16} />
<span>{'wasp new <app>'}</span>
<span>{'Get Started'}</span>
</button>
</Link>

Expand All @@ -55,7 +55,7 @@ const ActionButtons = () => (
`}
>
<BookOpen size={16} />
<span>Quick Guide</span>
<span>Documentation</span>
</button>
</Link>
</div>
Expand Down
6 changes: 3 additions & 3 deletions web/src/components/Nav/Announcement.js
Original file line number Diff line number Diff line change
Expand Up @@ -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')
Expand Down Expand Up @@ -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'>
Expand All @@ -49,7 +49,7 @@ const Announcement = () => {
hover:bg-neutral-600
`}
>
Check Out the Winners 🎉
Learn more →
</span>
</span>
</div>
Expand Down
2 changes: 1 addition & 1 deletion web/src/components/Nav/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -232,7 +232,7 @@ const Nav = () => {
transition ease-out duration-200
`}
>
{'wasp new <app>'}
Get Started
</button>
</Link>

Expand Down
Binary file added web/static/img/lw3/future-is-now.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added web/static/img/lw3/hug.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added web/static/img/lw3/lw-event-how-to-join.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added web/static/img/lw3/lw2-event-screenshot.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added web/static/img/lw3/lw3-banner.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added web/static/img/lw3/magic.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added web/static/img/lw3/realtime.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added web/static/img/lw3/tools.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added web/static/img/lw3/waspularity.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit 2db1dfa

Please sign in to comment.