Skip to content
This repository has been archived by the owner on Apr 19, 2021. It is now read-only.

[docs] HTML/CSS in Gitpod #488

Merged
merged 1 commit into from
Feb 27, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 20 additions & 0 deletions src/docs/html-in-gitpod.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
# HTML/CSS

Gitpod has great HTML and CSS support in fact, Gitpod was made with web development in mind. And, depending on your needs, you may want to customize this experience further!

## [emmet](http://emmet.io/) Support
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe make the "e" capitalized?


![emmet demo](images/emmet.png)
Gitpod comes with [emmet](http://emmet.io/) support right out of the box giving you access to powerful snippets and completions


## Live Preview

![image of preview](images/live_preview.png)
With Gitpod you can open a preview for Markdown and HTML files while you are coding in the upper right hand corner ![preview icon](images/preview.png) click it see the result in real time!

## Try It!

Want to try it out? And see a minimal example in action? Great, then you can open this in Gitpod:

[![JesterOrNot/Gitpod-Web-Development-Example](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/JesterOrNot/Gitpod-Web-Development-Example)
JesterOrNot marked this conversation as resolved.
Show resolved Hide resolved
JesterOrNot marked this conversation as resolved.
Show resolved Hide resolved
JesterOrNot marked this conversation as resolved.
Show resolved Hide resolved
Binary file added src/docs/images/HTML-Snippets-Example.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 src/docs/images/HTML_CSS_Extension.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 src/docs/images/emmet.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 src/docs/images/live_preview.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 src/docs/images/preview.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions src/docs/languages-and-frameworks.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
Below is a list of language and framework specific tips & tricks.

* [Python](/docs/python-in-gitpod/)
* [HTML](/docs/html-in-gitpod/)
* [Java](/docs/java-in-gitpod/)
* [C++](/docs/cpp-in-gitpod/)
* [Go](/docs/go-in-gitpod/)
Expand Down
4 changes: 4 additions & 0 deletions src/docs/menu.ts
Original file line number Diff line number Diff line change
Expand Up @@ -92,6 +92,10 @@ export const MENU: MenuEntry[] = [
"Python",
"python-in-gitpod"
),
M(
"HTML/CSS",
"html-in-gitpod"
),
M(
"Java",
"java-in-gitpod"
Expand Down