Introduction
I will assume you already know what ENS Domains (Ethereum Name Service) are and how to get one. If not, pease follow this link https://app.ens.domains or search for "Ethereum Name Service" on your browser for a deep dive.
In short, the Ethereum Name Service allows a user to create a registry on which one can store cryptocurrency addresses, connect to an external domain, and store text, url, or avatar information, among other types of text data. All of this information is secured as hashed data on the ethereum network. Users can select a personal ENS Address such as "hodl4ever.eth" or even emoji addresses like "🔥🚀.eth" to access this information in a familiar and elegant way.
One of the features of an ENS Domain is the ability to connect or redirect visitors to an external website. So any visitor heading to "https://hodl4ever.eth" for example will be directed to an external link setup in the registry by the ENS Domain owner. As of the time of this essay, ENS Domains only support redirecting to sites hosted on the IPFS protocol.
IPFS stands for Inter Planetary File System. IPFS is a blockchain protocol that allows hosting and sharing of files. Every file uploaded to IPFS is registered as hashed data and is given a unique hashed address.
If a user wants to point the ENS Domain to a personal website, the user will need to either upload the website files to the IPFS or upload a simple .html file that redirects to your website. In my case, I host my website on the Adobe Portfolio site, so I opted to redirect visitors to my ENS Domain (http://defidaniel.eth) to my personal blog on the Adobe site (https://danielre.me).
Either option you choose you need to interact with the IPFS protocol. For this, you also have two options: host your site locally on your computer or use a web service to host it for you.
TL;DR
Connecting an ENS to a Personal Website is very simple and straight forward but there are a few things to note.
1. An ENS Domain allows owners to direct visitors to an external site using the option CONTENT. But this feature only allows hashed IPFS addresses.
2. Users will need to upload their personal website to the IPFS in order to generate this hashed address that later will be entered in the ENS CONTENT Field.
3. Once the hashed address is entered in the ENS CONTENT field, the user will need to submit a transaction on Ethereum to confirm the changes and create the connection between the ENS Domain and the personal website.
Step 1: Register and Purchase an ENS Domain
Go to: https://app.ens.domains to purchase yours. Follow the steps to connect, purchase and setup your domain. The site will guide you.
Once you are setup, scroll down and get familiar with the types of data you are allowed to enter. Look for the CONTENT field. Notice how it guides you on what type of file addresses it is prompting. This is where you will be pasting your address website as a hashed link.
I registered and purchased the following ENS Domain: DeFiDaniel.eth
Check out my ENS Domain to use as an example: https://app.ens.domains/name/defidaniel.eth
Step 2a: Get your Site on IPFS (Local host)
1. Go to the IPFS Website https://ipfs.io or search for IPFS on your browser. Download the IPFS Desktop app.
2. Open the desktop app, go to Files and Upload your file(s). In my case I used a simple HTML file that redirects visitors to this file to my personal blog.
3. Once your file has been uploaded successfully, locate the share link option by clicking on the Epsilon Menu and selecting Share Link.
The Link will look something like this:
https://ipfs.io/ipfs/QmVbAXfDyjFnbejjz9pQyrtHCya3kpp6m8WfNqT2npoxKd?filename=Index.html
Step 2a: Get your Site on IPFS (External host)
1. Go to https://pinata.cloud or Search for Pinata Cloud on your browser. Open up an account.
2. Head over to Pinata Upload menu. Users can upload a File, a Directory or a Hash.
3. Upload your website file(s). In my case I used a simple HTML file that redirects visitors to this file to my personal blog.
4. Once the file has been uploaded, head over to the Pin Explorer menu and find your file. Copy the IPFS Hash link.
The Link will look something like this:
https://gateway.pinata.cloud/ipfs/QmVbAXfDyjFnbejjz9pQyrtHCya3kpp6m8WfNqT2npoxKd
Step 3: Setup your ENS Domain
1. Paste your Hashed Link in the CONTENT data field of your ENS Domain.
If you are hosting your IPFS File Locally, you will get an Error, Remove the data string from the ? sign and everything after.
The New Link will look something like this:
https://ipfs.io/ipfs/QmVbAXfDyjFnbejjz9pQyrtHCya3kpp6m8WfNqT2npoxKd
While you are in this stage, you can add social profile information or crypto addresses to accept and direct deposits to your ENS.
Once you are done entering information, scroll down and click "Confirm" to send an Ether transaction and save your data on the blockchain. The transaction time will depend on the cost of GAS at the time of submission.
You Are Done!
