My Story:

56 |

57 |

I'm an Electrical and Computer Engineering student with notable experience in computer science and programming. I am also Microsoft Learn Student Amabasador interested in all aspects of technology and especially in Biomedical Engineering, Artificial Intelligence and Internet of Things. I'm passionate about Arts & Design and I love creating beautiful things. I really enjoy learning new things and I'm always open to new ideas and projects.

58 |

59 |

60 |

Interests

61 |

Programming
Biomedical Engineering
App & Web Development
Machine Learning

67 |

68 |

My Work:

Here's a list of projects I built for the Responsive Web Design Certification on freeCodeCamp.

76 |

77 |

78 |

79 |

80 |

81 |

82 | Tribute Page 83 |

84 |

A tribute page dedicated to Vincent Van Gogh, built with HTML and CSS

85 |

86 |

87 | 88 |

89 |

90 |

91 |

92 |

93 |

94 | Survey Form 95 |

96 |

A survey form UI for an online course, built with HTML and CSS

97 |

98 |

99 | 100 |

101 |

102 |

103 |

104 |

105 |

106 | Product Landing Page 107 |

108 |

A product landing page for a medication reminder app, built with HTML and CSS

109 |

110 |

111 | 112 |

113 |

114 |

115 |

116 |

117 |

118 | Technical Documentation Page 119 |

120 |

A technical documentation page made for HTML

121 |

122 |

123 | 124 |

125 |

126 |

127 |

128 |

129 |

130 | Personal Portfolio Webpage 131 |

132 |

A static personal portfolio, built with HTML and CSS

133 |

134 |

135 | 136 |

29 |

30 |

31 |

32 |

Your personal medication reminder app

33 |

Spend less time thinking about medications and focus on other important things in life.

34 | 35 |

36 |

37 |

38 |

39 |

40 |

41 |

42 | 43 |

44 | 45 |

46 |

Why you should choose Remedi App

47 |

48 |

49 |

50 |

51 |

52 |

53 |

Easy to Use

54 |

Manage your medications with our user-friendly app. Get personalized reminders on time and stay connected to your caregivers. 55 |

56 |

57 |

58 | 59 |

60 |

61 |

62 |

63 |

64 |

Data Privacy

65 |

Your health is a private matter. We will never hand over your personal data to third parties. 66 |

67 |

68 |

69 | 70 |

71 |

72 |

73 |

74 |

75 |

Research

76 |

We use data gathered through our app to improve the healthcare system. We work together with healthcare companies who support us with scientific analyses of aggregated data. 77 |

78 |

79 |

80 | 81 |

82 |

83 | 84 |

85 |

Awesome Key Features

86 |

87 |

88 |

89 |

90 |

91 |

92 | 93 |

94 |

96 |
Med and refill reminders
97 |
Schedule your med reminders, track taken and missed doses and set refill reminders.
98 |
100 |
Medication adherence reports
101 |
Check your weekly and monthly adherence rates based on the number of taken and missed doses.
102 |
104 |
Teamwork
105 |
Add your most trusted family members and friends to send them a notification if you accidentally miss a medication.
106 |
108 |
Communicate with Your Doctor
109 |
Show your doctor how your health has progressed since the last appointment.
110 |

112 |

113 | 114 |

115 |

116 | 117 |

118 |

119 |

Medication Adherence

120 |

Medication adherence is the extent to which a person’s behaviour (taking medication, following a diet, and/or executing lifestyle changes) corresponds with agreed recommendations from a health care provider

121 |

A World Health Organization report on adherence to long-term therapies suggests that patients adhere to only 50% of drugs prescribed for chronic diseases in developed nations, a figure that is even lower in developing countries.

122 |

123 | 124 |

125 | 126 |

127 |

Download Remedi App

128 |

129 |

130 |

131 |

132 |

133 |

134 |

Features

135 |

Easily customizable pill reminders
Family and caregiver support
Doctor appointment manager
Track health measurements for various medical conditions
Weekly & monthly med reports to share with your doctor

142 |

143 | 144 |

145 | 146 |

147 |

148 |

149 |

150 |

151 |

Features

152 |

Unlimited patient list
Patient Medical Records
Create and keep track of patient's appointments
Cross-user and cross-device syncing
Secure encrypted cloud for saving clinical data

159 |

160 | 161 |

162 |

163 |

164 | 165 |

166 |

Contact

167 |

168 |

169 | 187 |

188 | 189 |

190 |

191 |

192 |

193 |

194 |

195 |

196 | 197 | 210 | 211 |

41 | 42 |

43 |

Introduction

44 |

45 |

HTML (Hypertext Markup Language) is not a programming language. It is a markup language that tells web browsers how to structure the web pages you visit. It can be as complicated or as simple as the web developer wants it to be. HTML consists of a series of elements, which you use to enclose, wrap, or mark up different parts of content to make it appear or act in a certain way. The enclosing tags can make content into a hyperlink to connect to another page, italicize words, and so on.

46 |

47 |

48 | 49 |

50 |

What you should already know

51 |

52 |

This guide assumes you have the following basic background:

53 |

Basic familiarity with using computers.
A general understanding of the Internet and the World Wide Web (WWW).
A basic understanding of creating and managing files.

58 |

59 |

60 | 61 |

62 |

Hello world

63 |

64 |

65 | To get started with writing HTML, open the Notepad and write the following HTML code: 66 |

67 |

<!DOCTYPE html>
 68 | <html>
 69 |   <body>
 70 |     <h1>Hello World!</h1>
 71 |   </body>
 72 | </html>

73 |

Save the file on your computer. Name the file "index.html" and open the saved HTML file in your browser. 74 |

75 |

76 |

77 | 78 |

79 |

Anatomy of an HTML element

80 |

81 |

Let's further explore our heading element from the previous example. The anatomy of our element is: 82 |

83 |

85 | The opening tag: This consists of the name of the element (in this example, p for paragraph), wrapped in opening and closing angle brackets. This opening tag marks where the element begins or starts to take effect. In this example, it precedes the start of the paragraph text. 86 |
88 | The content: This is the content of the element. In this example, it is the paragraph text. 89 |
91 | The closing tag: This is the same as the opening tag, except that it includes a forward slash before the element name. This marks where the element ends. 92 |

94 |

95 |

96 | 97 |

98 |

Nesting elements

99 |

100 |

Elements can be placed within other elements. This is called nesting. If we wanted to state that this is my first HTML lesson, we could wrap the word first in a element, which means that the word is to have strong(er) text formatting: 101 |

102 | This is my first HTML lesson. 103 |

There is a right and wrong way to do nesting. In the example above, we opened the p element first, then opened the strong element. For proper nesting, we should close the strong element first, before closing the p. 104 |

105 |

The following is an example of the wrong way to do nesting: 106 |

107 | This is my first HTML lesson. 108 |

109 |

110 | 111 |

112 |

Block versus inline elements

113 |

114 |

There are two important categories of elements to know in HTML: block-level elements and inline elements. 115 |

116 |

118 | Block-level elements form a visible block on a page. A block-level element appears on a new line following the content that precedes it. Any content that follows a block-level element also appears on a new line. Block-level elements are usually structural elements on the page. For example, a block-level element might represent paragraphs, lists, navigation menus, or footers. 119 |
121 | Inline elements are contained within block-level elements, and surround only small parts of the document’s content. An inline element will not cause a new line to appear in the document. It is typically used with text. 122 |

124 |

Consider the following example: 125 |

126 |

<em>first</em><em>second</em></em>third</em>
127 | <p>fourth</p><p>fifth</p><p>sixth</p>

128 |

em is an inline element. As you see below, the first three elements sit on the same line, with no space in between. On the other hand, p is a block-level element. Each p element appears on a new line, with space above and below.

129 |

firstsecondthird
130 | fourth
131 | fifth
132 | sixth

133 |

134 |

135 | 136 |

137 |

Empty elements

138 |

139 |

Not all elements follow the pattern of an opening tag, content, and a closing tag. Some elements consist of a single tag, which is typically used to insert/embed something in the document. 140 |

141 | <img src="https://raw.githubusercontent.com/mdn/beginner-html-site/gh-pages/images/firefox-icon.png"> 142 |

143 |

144 | 145 |

146 |

Attributes

147 |

148 |

Elements can also have attributes. Attributes look like this: 149 |

150 | This is my first HTML lesson. 151 |

Attributes contain extra information about the element that won't appear in the content. In this example, the class attribute is an identifying name used to target the element with style information. 152 |

153 |

An attribute should have:

154 |

A space between it and the element name.
The attribute name, followed by an equal sign.
An attribute value, wrapped with opening and closing quote marks.

159 |

160 |

161 | 162 |

163 |

Anatomy of an HTML document

164 |

165 |

166 | Individual HTML elements aren't very useful on their own. Next, let's examine how individual elements combine to form an entire HTML page: 167 |

168 |

<!DOCTYPE html>
169 | <html>
170 |   <head>
171 |     <title>My test page</title>
172 |   </head>
173 |   <body>
174 |     <p>This is my page</p>
175 |   </body>
176 | </html>

177 |

The doctype: When HTML was young (1991-1992), doctypes were meant to act as links to a set of rules that the HTML page had to follow to be considered good HTML. 179 |
181 | The html element wraps all the content on the page. It is sometimes known as the root element. 182 |
184 | The head element acts as a container for eveything you want to include on the HTML page, that isn't the content the page will show to viewers. This includes keywords and a page description that would appear in search results, CSS to style content, character set declarations, and more. 185 |
187 | The title element. This sets the title of the page, which is the title that appears in the browser tab the page is loaded in. The page title is also used to describe the page when it is bookmarked. 188 |
190 | The body element. This contains all the content that displays on the page, including text, images, videos, games, playable audio tracks, or whatever else. 191 |

193 |

194 |

195 | 196 |

197 |

Whitespace in HTML

198 |

199 |

200 | No matter how much whitespace you use inside HTML element content (which can include one or more space character, but also line breaks), the HTML parser reduces each sequence of whitespace to a single space when rendering the code. 201 |

202 |

203 | These two code snippets are equivalent: 204 |

205 |

<p>This is a paragraph.</p>
206 | <p>This    is a
207 |   paragraph.</p>

208 |

209 |

210 | 211 |

212 |

Comments

213 |

214 |

215 | HTML has a mechanism to write comments in the code. Browsers ignore comments, effectively making comments invisible to the user. The purpose of comments is to allow you to include notes in the code to explain your logic or coding. This is very useful if you return to a code base after being away for long enough that you don't completely remember it. Likewise, comments are invaluable as different people are making changes and updates. 216 |

217 |

<!-- This is a comment -->
218 | <p> This is a paragraph </p>

219 |

220 |

221 | 222 |

223 |

Summary

224 |

225 |

226 | You made it to the end of the article! We hope you enjoyed your tour of the basics of HTML. At this point, you should understand what HTML looks like, and how it works at a basic level. You should also be able to write a few elements and attributes. 227 |

228 |

All the documentation in this page is taken from 229 | MDN 230 |

231 |

232 |

233 |

14 |

15 |

16 |

17 |

Vincent Van Gogh

18 |

Post-Impressionist Artist

19 |

20 |

Between November of 1881 and July of 1890, Vincent van Gogh painted almost 900 paintings. Since his death, he has become one of the most famous painters in the world. Van Gogh’s paintings have captured the minds and hearts of millions of art lovers.

21 |

22 |

23 |

24 |

25 |

Portrait of Van Gogh with Grey Felt Hat, Oil painting, Winter 1887/88

26 |

27 |

28 |

29 |

30 |

31 |

32 |

Biography

33 |

Vincent Van Gogh was born on 30 March 1853 in Zundert in the southern Netherlands, the son of a pastor. In 1869, he took his first job, working in the Hague branch of an international art dealing firm. He began to write to his younger brother Theo, a correspondence which continued for the rest of Van Gogh's life.

34 |

Van Gogh's job took him to London and Paris, but he was not interested in the work and was dismissed in 1876. He briefly became a teacher in England, and then, deeply interested in Christianity, a preacher in a mining community in southern Belgium.

35 |

In 1880, at the age of 27, he decided to become an artist. He moved around, teaching himself to draw and paint and receiving financial support from Theo. In 1886, Van Gogh joined Theo in Paris, and met many artists including Degas, Toulouse-Lautrec, Pissarro and Gauguin, with whom he became friends. His style changed significantly under the influence of Impressionism, becoming lighter and brighter. He painted a large number of self-portraits in this period.

36 |

In 1888, Van Gogh moved to Provence in southern France, where he painted his famous series 'Sunflowers'. He invited Gauguin to join him but they soon began to quarrel and one night, Van Gogh threatened Gauguin with a razor. Deeply remorseful he then cut off part of his own ear.

37 |

This was the first serious sign of the mental health problems that were to afflict Van Gogh for the rest of his life. He spent time in psychiatric hospitals and swung between periods of inertia, depression and incredibly concentrated artistic activity, his work reflecting the intense colours and strong light of the countryside around him.

38 |

On 27 July 1890, again suffering from depression, Van Gogh shot himself. He died two days later.

39 |

40 |

41 |

42 |

43 |
“I don't know anything with certainty, but seeing the stars makes me dream.”
44 |

45 | Learn more about Vincent Van Gogh 46 |

47 | 48 |

49 |

Gallery

50 |

51 |

54 |
Starry Night
55 |
1889, Oil on Canvas
56 |

58 |

61 |
Starry Night Over the Rhone
62 |
1888, Oil on Canvas
63 |

65 |

68 |
Irises
69 |
1889, Oil on Canvas
70 |

72 |

Almond blossom — 75 |
Almond Blossom
76 |
1890, Oil on Canvas
77 |

79 |

82 |
The Bedroom
83 |
1889, Oil on Canvas
84 |

86 |

89 |
Wheatfield with a Reaper
90 |
1889, Oil on Canvas
91 |

93 |

94 |

95 |

96 | 97 |

Sources

98 |

100 | The Van Gogh Gallery 101 |
103 | Van Gogh Museum 104 |
106 | BBC History: Vincent Van Gogh 107 |

109 |

110 | 113 |

Hello,

My Story:

Interests

My Work:

82 | Tribute Page 83 |

94 | Survey Form 95 |

106 | Product Landing Page 107 |

118 | Technical Documentation Page 119 |

130 | Personal Portfolio Webpage 131 |

Let's work together

Your personal medication reminder app

Why you should choose Remedi App

Easy to Use

Data Privacy

Research

Awesome Key Features

Med and refill reminders

Medication adherence reports

Teamwork

Communicate with Your Doctor

Medication Adherence

Download Remedi App

Features

Features

Contact

Learner Experience Survey

Vincent Van Gogh

Biography

Gallery

Sources