I have a bit of a secret. Even though I work with React a lot, I REALLY don't like JSX. There are several reasons why but it basically boils down to JSX is completely unnecessary. Regular, plain old Javascript can do everything that JSX does. If you peak under the hood when you build a React project there's a step that just converts JSX to plain JS.  So why not skip converting from JSX to JS and just write regular Javascript to begin with? That was my thinking when I first started using r-dom. r-dom lets you use React without JSX. So instead of rendering components like `<Component foo={ bar }>Hello world!</Component>` you can write JS and render components with `r(Component, { foo: bar }, 'Hello world!')`. r-dom had the backing of a major company in Uber. So surely the code would be maintained and updated going forward, right? Wrong. The project was abandoned by Uber a few years back. Everything was fine until I upgraded to a newer version of React and suddenly the console was full of warnings because r-dom depends on outdated React APIs. So I made a drop in replacement. [benlarkins/render-dom](//github.com/benlarkins/render-dom) has the exact same API as r-dom but it works with the latest versions of React. If you still use r-dom consider switching to render-dom and say goodbye to those endless warnings filling the console. 👋 

I've used render-dom in production for a couple of years without any issues. The code is really simple. It's just a lightweight wrapper around [React.createElement](https://reactjs.org/docs/react-api.html#createelement). render-dom improves the createElement API and adds a couple of convenient features. Give it a try if you want to ditch JSX and/or need an up-to-date replacement for r-dom. To migrate from r-dom just npm install/yarn add render-dom then switch your imports from `
import r from r-dom;` to `import r from render-dom;` and everything should just work. [Check out the docs](//github.com/benlarkins/render-dom) for more info.

Happy coding.

Uber archived r-dom so I made a drop in replacement

# If you prefer you can follow along with [a Youtube video walkthrough](https://youtu.be/GHqP8QHG9t0)

Note this post will show you how to redirect from one domain to another and not pass the URL path. (ie redirect from https://slcwebsites.com to https://google.com) If you want to pass the URL path when redirecting then additional settings are needed when setting up the API Gateway.


## 1) Create lambda function
First create a lambda function to redirect to the new domain name. Name it redirectTo{Name} and add the following code:


```
export const handler = async (event) => {
  return  {
    body: "",
    headers: { Location: 'https://google.com' },
    isBase64Encoded: false,
    statusCode: 301,
  };
};
```



![lamda_redirect.png](https://api.benlarkins.com/uploads/lamda_redirect_03e22bdd66.png)

## 2) Create API Gateway
Next create a new API Gateway. Under REST API select "Build". Then choose New API, name the API and click "Create API"

![rest_api.png](https://api.benlarkins.com/uploads/rest_api_ae193c84ea.png)

![create_api.png](https://api.benlarkins.com/uploads/create_api_5186ec1e60.png)

Next click the "Actions" drop down button then "Create Resource". Check "Configure as proxy resource" then create "Create Resource".

![create_resource.png](https://api.benlarkins.com/uploads/create_resource_fd157e5781.png)

![create_resource_2.png](https://api.benlarkins.com/uploads/create_resource_2_5019cc42d6.png)


Next click the root "/" resource then click the "Actions" drop down button and choose "Create Method". Click the check mark next to "GET". Select "Lamdba Function" for Integration type and check the "Use Lambda Proxy integration" option. In the "Lambda Function" input type the name you chose for the Lambda function earlier "redirectTo{Name}". Now click "Save".

![create_method.png](https://api.benlarkins.com/uploads/create_method_907ff7304e.png)

![add_get_method.png](https://api.benlarkins.com/uploads/add_get_method_acb64b474d.png)

![lamda_proxy_integration.png](https://api.benlarkins.com/uploads/lamda_proxy_integration_fd715b5933.png)

Next click "ANY" under "/{proxy+}" and type the name of the Lamdba function "redirectTo{Name}" again.  Now click "Save".

![proxy_any_setup.png](https://api.benlarkins.com/uploads/proxy_any_setup_74de81cfa6.png)

Next click the "Actions" button drop down again and click "Deploy API". Select "[New Stage]" and enter a Stage name. I entered default because I'm not using stages for this API. Now click the "Deploy" button.

![deploy_api.png](https://api.benlarkins.com/uploads/deploy_api_6c3baf429d.png)

## 3) Set up Custom Domain
Next click "Custom Domain Names" on the left side menu.

![custom_domain_names.png](https://api.benlarkins.com/uploads/custom_domain_names_b28f312651.png)

Click the "Create" button. Then input the domain name that you want to redirect **FROM**. Select the correct ACM certificate for the domain name and click the "Create domain name" button. This should be a domain name that you already have set up in Route 53.

![create_domain_name.png](https://api.benlarkins.com/uploads/create_domain_name_395e38df09.png)

Next click the "Configure API mappings" button. Add a new mapping and select the API gateway you created earlier and the stage. Then click the "Save" button.

![configure_API_mappings.png](https://api.benlarkins.com/uploads/configure_API_mappings_34a1f03e21.png)

![configure_API_mappings_2.png](https://api.benlarkins.com/uploads/configure_API_mappings_2_9be4e63cb2.png)

## 4) Create Route 53 A Record
Finally go to Route 53 and select the correct hosted zone for the domain that you want to redirect **FROM**. Add or edit an "A" record. Toggle on "Alias". Then under "Route traffic to" select "Alias to API Gateway API". Select the correct AWS region. Then select the URL for the Gateway API you created earlier. Now click the "Save" button.

![route_53_a_record.png](https://api.benlarkins.com/uploads/route_53_a_record_7f9da9d9e2.png)

After the new A record propagates to the DNS servers you should be able to visit the old domain name and the browser will redirect to the new domain name. 

_Note: this method will not forward the URL path. That will take additional configuration in the API Gateway._