mirror of
https://github.com/ysoftdevs/cloud-workshop.git
synced 2026-02-19 08:57:57 +01:00
add 10 exercises
This commit is contained in:
56
README.md
56
README.md
@@ -1,2 +1,58 @@
|
||||
# cloud-workshop
|
||||
Materials for workshop about cloud development
|
||||
|
||||
|
||||
# Exercises
|
||||
|
||||
## 01. Create application skeleton
|
||||
|
||||
Create H1 header with title of application.
|
||||
Add div tag with English word.
|
||||
Add 4 buttons tags with Czech translation.
|
||||
|
||||
## 02. Fix diacritics
|
||||
|
||||
Add necessary header in order to display diacritics correctly.
|
||||
|
||||
## 03. Add Twitter bootstrap
|
||||
|
||||
Add Twitter bootstrap CDN to header to make app nicer
|
||||
|
||||
- http://getbootstrap.com/getting-started/
|
||||
|
||||
## 04. Change 4 divs to buttons
|
||||
|
||||
Change 4 Czech options to 4 buttons. Replace div tag by button tag and class.
|
||||
|
||||
## 05. Use Twitter style of buttons
|
||||
|
||||
Add CSS class definition to buttons: class="btn btn-default"
|
||||
|
||||
## 06. Display alert when on button click
|
||||
|
||||
Add JavaScript using jQuery and display alert after any button click.
|
||||
|
||||
- https://code.jquery.com/
|
||||
|
||||
## 07. Display alert with value of clicked button
|
||||
|
||||
We need to know what is value of clicked button. Find it and display it.
|
||||
|
||||
## 08. Display alert with success or fail
|
||||
|
||||
Compare value from clicked button and display alert with fail or success.
|
||||
|
||||
## 09. Status message
|
||||
|
||||
Add div with id "status" and set its "text" value instead of display alert.
|
||||
|
||||
- http://api.jquery.com/text/
|
||||
|
||||
## 10. Status icon
|
||||
|
||||
Display icon which indicates status. Use Twitter Glyphicons.
|
||||
|
||||
- http://getbootstrap.com/components/
|
||||
- http://api.jquery.com/addClass/
|
||||
- http://api.jquery.com/removeClass/
|
||||
|
||||
|
||||
Reference in New Issue
Block a user