Build Tools?

n18dccn166

October 6, 08:56 AM

How do I start learning build tools for frontend? Thank you!

Select One:
bo-iliev

October 6, 07:28 PM

Hi there,

What I would suggest is that you pick a tool and start trying to create as many things as you can. The best practice is actually trying the stuff out yourselves.

There are a ton of materials out there on the internet which will help you learn the basics, but that's only for the introduction into a certain topic. In my opinion the best way to learn something is by actually doing it.

But this is my personal opinion and is what I think is the best thing to do when your learning something new.

So choose which tools you want to learn and start using them as much as possible.

Best,

Boyan

Select One:
Write
Preview
Help
Cursor Start: Cursor End:
Type '/' for commands
Drop Files Here

Markdown Basics

Below you will find some common used markdown syntax. For a deeper dive in Markdown check out this Cheat Sheet


Bold & Italic

Italics *asterisks*
Bold **double asterisks**


Code

Inline Code
`backtick`Code Block```
Three back ticks and then enter your code blocks here.
```


Headers

# This is a Heading 1
## This is a Heading 2
### This is a Heading 3


Quotes

> type a greater than sign and start typing your quote.

Links

You can add links by adding text inside of [] and the link inside of (), like so:

[link_text](https://google.com)

Lists

To add a numbered list you can simply start with a number and a ., like so:
1. The first item in my list

For an unordered list, you can add a dash -, like so:
- The start of my list


Images

You can add images by selecting the image icon, which will upload and add an image to the editor, or you can manually add the image by adding an exclamation !, followed by the alt text inside of [], and the image URL inside of (), like so:

![alt text for image](url_to_image.png)

Dividers

To add a divider you can add three dashes or three asterisks:
--- or ***


Embedding GIFs via Giphy

You can easily embed animated GIFS with the following syntax:
{% giphy https://giphy.com/embed/giphy_id %}


Embedding Codepens

You can also embed a codepen by writing the following:
{% codepen https://codepen.io/your/pen/url %}

You may also choose the default tabs you wish to show your pen by writing the default-tab like so: (default is result)

{% codepen https://codepen.io/your/pen/url default-tab=result,html %}


Embedding CodeSandbox

You can also embed CodeSandbox by writing the following:
{% codesandbox YOUR_CODESANDBOX_EMBED_URL %}


Embedding YouTube Videos

You can also embed a YouTube video by writing the following:
{% youtube VIDEO_ID_HERE %}


Embedding buymeacoffee.com

You can also embed your "Buy me a coffee" button by writing the following:
{% buymeacoffee BUY_ME_A_COFFEE_USERNAME_HERE %}


Please login, or signup to write a response.