DEV Community: Sanamdeep Singh

MarkDown for beginners

Sanamdeep Singh — Mon, 25 Mar 2019 02:37:56 +0000

What is markdown?

Lightweight markup language
Can be converted into HTML/XHTML and other formats
It's main purpose is readability and ease of use

What is it used for?

Readme Files(GitHub, etc)
Forums and Blogs
Used in may static site generators

Some basic things you can format

Headings Blocks of Code

Lists Images

Emphasis Blockquotes

Links Horizontal Rules

Headings

# H1 Heading
## H2 Heading
### H3 Heading
#### H4 Heading
##### H5 Heading
###### H6 Heading

H1 Heading

H2 Heading

H3 Heading

H4 Heading

H5 Heading

H6 Heading

Italics

*This text is in italics*

_This text_ is in italics

This text is in italics

This text is in

Strong

 **This text is in strong**

__This text__ is in strong

This text is in italics

This text is in italics

Strikethrough

~~This text~~ is strikethough

~~This text~~ is strikethough

Horizontal Rule

---

show speacial character

\*This text is in italics\*

*This text is in italics*

Blockquotes

> This is a Quote

This is a Quote

[https://www.sanamdeep.dev](https://www.sanamdeep.dev)

https://www.sanamdeep.dev

show title on hover

[https://www.sanamdeep.dev](https://www.sanamdeep.dev "sanamdeep.dev")

[https://www.sanamdeep.dev](https://www.sanamdeep.dev "sanamdeep.

Unordered Lists

* Item 1
  * Item 1.1
    * Item 1.1.1
* Item 2
  * Item 2.1
    * Item 2.1.1

Item 1
- Item 1.1
- Item 1.1.1
Item 2
- Item 2.1
- Item 2.1.1

Ordered List

1. Item
    1. Item1.1
        1. Item 1.2
2. Item 2
    1. Item 2.1
        1. Item 2.1.1

Item
1. Item1.1
  1. Item 1.2
Item 2
1. Item 2.1
  1. Item 2.1.1

Blockquotes

`<p>This is a paragraph</p>`

<p>This is a paragraph</p>

Images

![Markdown Logo](https://markdown-here.com/img/icon256.png)

GitHub markdown

Code Blocks

```bash
npm install
```

npm install

```javascript
function add(num1, num2) {
return num1 + num2;
}
```

  function add(num1, num2) {
    return num1 + num2;
  }

```python
def add(num1, num2):
return num1 + num2
```

  def add(num1, num2):
    return num1 + num2

Tables

| Name    |  Email   |
| ----    |  ------  |
| John Doe | john@gmail.com |
| Jane Doe | john@gmail.com |

Name	Email
John Doe	john@gmail.com
Jane Doe	john@gmail.com

Task Lists

* [x] Task 1 completed
* [x] Task 2 completed
* [ ] Task 3 not completed

[x] Task 1 completed
[x] Task 2 completed
[ ] Task 3 not completed

Host a Website Using AWS CloudFront, Origin Access Identity, S3 without Static Website Hosting

Sanamdeep Singh — Sun, 17 Mar 2019 05:06:39 +0000

This Second tutorial is to host a website on AWS and Restricting Access to Amazon S3 Content by Using an Origin Access Identity.

Step 1: Register a Domain
Buy a domain of your choice. eg sanamdeep.com. You can buy your domain from AWS, Google domains, Go Daddy and other providers. For the scope of this blog we will consider domain to be sanamdeep.com . You will use the domain you have chosen and replace them with the usage in below steps.
To buy domain name from AWS go to Route53 and check for available domains of your choice.
Step 2: AWS Setup
This Step involves multiple substeps.

Setting up ACM or AWS Certificate Manager.
ACM handles the complexity of creating and managing public SSL/TLS certificates for your AWS based websites and applications.
Go to AWS Certificate Manager and select “Request a certificate” > “Request a public certificate” > Under domain name enter sanamdeep.com and *.sanamdeep.com . The second domain name is for all the subdomains like www.sanamdeep.com . > choose “DNS validation” > Review > confirm and request.
After this step if you have bought your domain from AWS then you will have to wait for 10–15 minutes while the certificate is issued. Otherwise if you have bought your domain from a third party domain provider then you will need to click on “ Export DNS configuration to a file” option inside your requested certificate and copy the DNS Name and Values to your domain settings.
Eg for Google Domain you can go to your particular domain and under DNS > Custom resource records you will add the DNS entries. Only enter unique entries.
Only after this step is completed will AWS take 10–15 minutes to issue a certificate.
Set up S3 Buckets
Go to S3 and make bucket www.sanamdeep.com . For the purpose of a sample website use a Hello world HTML file.
Setting up CloudFront
Now we will set up two CloudFront one for sanamdeep.com and the other for www.sanamdeep.com
First lets create CloudFront from www.sanamdeep.com.
Create Distribution > Web > Get Started > Under Origin domain path you need to add S3 bucket for www.sanamdeep.com.
Note: Select the option displayed under Origin domain path.
Upon entering the Origin domain path the Origin ID is automatically populated.
Check yes under Restrict Bucket Access. Now you will see Origin Access Identity option. If you have not created Identity before select yes else use an existing one.
Under Grant Read Permissions on Bucket choose yes. This will automatically add a bucket policy to grant permission to CloudFront to access S3 objects.
Under Default Cache Behavior Settings > Viewer Protocol Policy choose Redirect Http to Https.
Under Distribution Settings > Alternate Domain Names(CNAMEs) > enter www.sanamdeep.com
Under Distribution Settings > SSL Certificate >choose Custom SSL certificate and choose your certificate
Under Distribution Settings > Default Root Object type index.html
Click Create Distribution. After this CloudFront will take 20–30 minutes to be deployed.
Repeat the process for sanamdeep.com
since we created only one bucket we will use www.sanamdeep.com here as well.
Use sanamdeep.com as the Alternate Domain Names(CNAMEs)
enter index.html under Distribution Settings > Default Root Object for sanamdeep.com
Rest of the settings will be similar to the previous CloudFront.
Note: The purpose of this CloudFront is to redirect traffic coming to sanamdeep.com to redirect to www.sanamdeep.com bucket. So the settings would remain the same.
Setting up Route53
In this step Under Hosted Zones > Create Hosted Zones
Enter Domain as sanamdeep.com and click create.
Now under the newly created hosted zone sanamdeep.com you will find two automatically created record sets.
One of them will have the Name servers with four entries.
Now Click Create Record Sets >under Name put sanamdeep.com >
check Alias as yes > choose alias target as the corresponding CloudFront. Make sure to choose the right alias Target.
Create a Record Set for www.sanamdeep.com following the above steps.
Copying the DNS entries
For Third party providers we already copied the DNS entries from certificate manager. But for people using domain from AWS you will need to copy the DNS entries under Route53 if not added automatically.
Copying Name Servers
This step is for domains from third-party providers copy the Name Serversgenerated in Route53 and add them to the domain. Eg for google domains they can be added under DNS> Name Servers
After this step, you can open your website either by www.sanamdeep.com or sanamdeep.com. Both will be redirected to https://www.sanamdeep.com

Changes not reflecting on website
Also in case, you make the change to your website by changing contents in S3 bucket. CloudFront can take some time before reflecting the changes automatically. A Faster way is to go to the CloudFront > Invalidations > Create Invalidation and enter /* if you want to invalidate all the files. After creating the invalidation on both www.sanamdeep.com and sanamdeep.com, the changes will be reflected immediately.

How to host a Static website using Amazon CloudFront, Route53, Certificate manager, S3

Sanamdeep Singh — Sun, 17 Mar 2019 05:05:04 +0000

Setting up my own website using AWS I realized how confusing it can be to find all the right information. So I decided to step up and write a blog myself.

My aim is to run you through some steps so you can have your website up and running in minutes. Here are some steps and checklist to successfully host a website.

Step 1: Register a Domain
Buy a domain of your choice. eg sanamdeep.dev. You can buy your domain from AWS, Google domains, Go Daddy and other providers. For the scope of this blog we will consider domain to be sanamdeep.dev . You will use the domain you have chosen and replace them with the usage in below steps.
To buy domain name from AWS go to Route53 and check for available domains of your choice.
Step 2: AWS Setup
This Step involves multiple substeps.

Setting up ACM or AWS Certificate Manager.
ACM handles the complexity of creating and managing public SSL/TLS certificates for your AWS based websites and applications.
Go to AWS Certificate Manager and select “Request a certificate” > “Request a public certificate” > Under domain name enter sanamdeep.dev and .sanamdeep.dev . The second domain name is for all the subdomains like www.sanamdeep.dev . > choose “DNS validation” > Review > confirm and request.
After this step if you have bought your domain from AWS then you will have to wait for 10–15 minutes while the certificate is issued. Otherwise if you have bought your domain from a third party domain provider then you will need to click on “ Export DNS configuration to a file” option inside your requested certificate and copy the DNS Name and Values to your domain settings.
Eg for Google Domain you can go to your particular domain and under DNS > Custom resource records you will add the DNS entries. Only enter unique entries.
Only after this step is completed will AWS take 10–15 minutes to issue a certificate.
Set up S3 Buckets
Go to S3 and make 2 buckets www.sanamdeep.dev and sanamdeep.dev .
We are creating two buckets so a request from sanamdeep.dev will be redirected to www.sanamdeep.dev
Go to bucket sanamdeep.dev and under Permissions > Access public settings edit all the below properties to be false.
Next under Properties > Static website hosting > choose Redirect requests and set target as www.sanamdeep.dev and protocol as https.
Now Go to bucket www.sanamdeep.dev and under Permissions > Access public settings edit all the below properties to be false.
and put the following policy under Bucket Policy
{
“Version”: “2012–10–17”,
“Statement”: [
{
“Sid”: “PublicReadForGetBucketObjects”,
“Effect”: “Allow”,
“Principal”: “”,
“Action”: “s3:GetObject”,
“Resource”: “arn:aws:s3:::www.sanamdeep.dev/*”
}
]
}
Next under Properties > Static website hosting > Use this bucket to host a website and under index document put index.html. You can now test the endpoint. For the purpose of a sample website use a Hello world HTML file.
While adding files to www.sanamdeep.dev make sure to change Manage public permissions to Grant public read access to this object(s).
Setting up CloudFront
Now we will set up two CloudFront one for sanamdeep.dev and the other for www.sanamdeep.dev
First lets create CloudFront from www.sanamdeep.dev.
Create Distribution > Web > Get Started > Under Origin domain path you need to copy the endpoint for S3 bucket for www.sanamdeep.dev . You can go to the S3 bucket and under properties > Static website hosting you can find the endpoint.
Note: do not select the option displayed under Origin domain path.
Upon entering the Origin domain path the Origin ID is automatically populated.
Under Default Cache Behavior Settings > Viewer Protocol Policy choose Redirect Http to Https.
Under Distribution Settings > Alternate Domain Names(CNAMEs) > enter www.sanamdeep.dev
Under Distribution Settings > SSL Certificate >choose Custom SSL certificate and choose your certificate
Under Distribution Settings > Default Root Object type index.html
Click Create Distribution. After this CloudFront will take 20–30 minutes to be deployed.
Repeat the process for sanamdeep.dev
Get the endpoint from sanamdeep.dev bucket.
Use sanamdeep.dev as the Alternate Domain Names(CNAMEs)
No need to enter index.html under Distribution Settings > Default Root Object for sanamdeep.dev
Rest of the settings will be similar to the previous CloudFront.
Setting up Route53
In this step Under Hosted Zones > Create Hosted Zones
Enter Domain as sanamdeep.dev and click create.
Now under the newly created hosted zone sanamdeep.dev you will find two automatically created record sets.
One of them will have the Name servers with four entries.
Now Click Create Record Sets >under Name put sanamdeep.dev >
check Alias as yes > choose alias target as the corresponding CloudFront. Make sure to choose the right alias Target.
Create a Record Set for www.sanamdeep.dev following the above steps.
Copying the DNS entries
For Third party providers we already copied the DNS entries from certificate manager. But for people using domain from AWS you will need to copy the DNS entries under Route53 if not added automatically.
Copying Name Servers
This step is for domains from third-party providers copy the Name Servers generated in Route53 and add them to the domain. Eg for google domains they can be added under DNS> Name Servers
After this step, you can open your website either by www.sanamdeep.dev or sanamdeep.dev. Both will be redirected to https://www.sanamdeep.dev

Changes not reflecting on website
Also in case, you make the change to your website by changing contents in S3 bucket. CloudFront can take some time before reflecting the changes automatically. A Faster way is to go to the CloudFront > Invalidations > Create Invalidation and enter /* if you want to invalidate all the files. After creating the invalidation on both www.sanamdeep.dev and sanamdeep.dev, the changes will be reflected immediately.