#1 Getting started

[Dyzio18]

1 Getting started with HTML5 and base website structure

Steps

1. Create directory in repository named lesson-1-getting-started
2. Create index.html file. (We code with HTML5 standard)
3. Read more obout HTML5: https://developer.mozilla.org/pl/docs/HTML/HTML5

You can download boilerplate/template code and started from here as example: https://html5boilerplate.com/ - we focus on good practices and clean/semantic code.

4. Add to your HTML external files: js/script.js and css/style.css, create images/ directory in lesson root catalog.
5. Add to your HTML file bootstrap style & scripts (https://getbootstrap.com/docs/5.0/getting-started/introduction/)
6. Create form using Bootstrap (version 5). Form should include single input with number value and submit button.

Use components/class to build responsive layout with form:

• https://getbootstrap.com/docs/5.0/layout/containers/
• https://getbootstrap.com/docs/5.0/layout/grid/
• https://getbootstrap.com/docs/5.0/forms/form-control/
• https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/number

DOCS & LEARN MORE: https://developer.mozilla.org/en-US/docs/Learn

7. With bootstrap or your own style make border (2px, solid, #333333) around form
8. In JS file write function to display in console value from form after submit
   • https://developer.mozilla.org/pl/docs/Web/API/Console/log
   • Google pharse and try solve problem: 'get form input value javascript on submit'
   • use stackoverflow to solve problem https://stackoverflow.com/questions/tagged/javascript

TEST CASE: Display form value after submit.

Edge cases:

• value is empty

• value is not number

  In future you will develop this page and add more components. Try keep your code clean,

[Dyzio18]