Add Elm dry page.
This commit is contained in:
parent
ba42fb088f
commit
203f5309b2
55
src/Pages/Software/elm/en/dry.md
Normal file
55
src/Pages/Software/elm/en/dry.md
Normal file
@ -0,0 +1,55 @@
|
|||||||
|
Elm - DRY
|
||||||
|
=========
|
||||||
|
|
||||||
|
DRY means: "[Don't Repeat Yourself](https://en.wikipedia.org/wiki/Don%27t_repeat_yourself)".
|
||||||
|
|
||||||
|
This page contains some common mistakes I make when writing Elm code and how I processed feedback afterwards to improve it.
|
||||||
|
|
||||||
|
|
||||||
|
```elm
|
||||||
|
let
|
||||||
|
render item =
|
||||||
|
case warning item of
|
||||||
|
Just (Error tooltip) ->
|
||||||
|
[ Html.text <| text item
|
||||||
|
, Html.i
|
||||||
|
[ HtmlAttributes.class "icon-error"
|
||||||
|
, HtmlAttributes.title tooltip
|
||||||
|
]
|
||||||
|
]
|
||||||
|
-- Another case, very similar to the one above.
|
||||||
|
Just (Warning tooltip) ->
|
||||||
|
[ Html.text <| text item
|
||||||
|
, Html.i
|
||||||
|
[ HtmlAttributes.class "icon-warning"
|
||||||
|
, HtmlAttributes.title <| getWarningTooltip tooltip
|
||||||
|
]
|
||||||
|
]
|
||||||
|
|
||||||
|
Nothing ->
|
||||||
|
[ Html.text <| text item ]
|
||||||
|
|
||||||
|
```
|
||||||
|
|
||||||
|
```elm
|
||||||
|
let
|
||||||
|
render item =
|
||||||
|
let
|
||||||
|
createHtml class tooltip =
|
||||||
|
[ Html.text <| text item
|
||||||
|
, Html.i
|
||||||
|
[ HtmlAttributes.class class
|
||||||
|
, HtmlAttributes.title tooltip
|
||||||
|
]
|
||||||
|
]
|
||||||
|
in
|
||||||
|
case warning item of
|
||||||
|
Just (Error tooltip) ->
|
||||||
|
createHtml "icon-error" tooltip
|
||||||
|
|
||||||
|
Just (Warning tooltip) ->
|
||||||
|
createHtml "icon-warning" (getWarningTooltip tooltip)
|
||||||
|
|
||||||
|
Nothing ->
|
||||||
|
[ Html.text <| text item ]
|
||||||
|
```
|
||||||
@ -1,4 +1,5 @@
|
|||||||
## Formatting
|
Elm - Formatting
|
||||||
|
================
|
||||||
|
|
||||||
You can add a docstring to an elm function like this:
|
You can add a docstring to an elm function like this:
|
||||||
|
|
||||||
|
|||||||
@ -1,4 +1,5 @@
|
|||||||
### Elm
|
### Elm
|
||||||
|
|
||||||
* [Formatting](./formatting)
|
* [Formatting](./formatting)
|
||||||
* [Maybe.map](./maybemap)
|
* [Maybe.map](./maybemap)
|
||||||
|
* [Don't Repeat Yourself](./dry)
|
||||||
54
src/Pages/Software/elm/nl/dry.md
Normal file
54
src/Pages/Software/elm/nl/dry.md
Normal file
@ -0,0 +1,54 @@
|
|||||||
|
Elm - DRY
|
||||||
|
=========
|
||||||
|
|
||||||
|
DRY betekent: "[Don't Repeat Yourself](https://en.wikipedia.org/wiki/Don%27t_repeat_yourself)". Ofwel, herhaal jezelf niet.
|
||||||
|
|
||||||
|
Deze pagina bevat voorbeelden van Elm code die ik heb herschreven.
|
||||||
|
|
||||||
|
```elm
|
||||||
|
let
|
||||||
|
render item =
|
||||||
|
case warning item of
|
||||||
|
Just (Error tooltip) ->
|
||||||
|
[ Html.text <| text item
|
||||||
|
, Html.i
|
||||||
|
[ HtmlAttributes.class "icon-error"
|
||||||
|
, HtmlAttributes.title tooltip
|
||||||
|
]
|
||||||
|
]
|
||||||
|
-- Another case, very similar to the one above.
|
||||||
|
Just (Warning tooltip) ->
|
||||||
|
[ Html.text <| text item
|
||||||
|
, Html.i
|
||||||
|
[ HtmlAttributes.class "icon-warning"
|
||||||
|
, HtmlAttributes.title <| getWarningTooltip tooltip
|
||||||
|
]
|
||||||
|
]
|
||||||
|
|
||||||
|
Nothing ->
|
||||||
|
[ Html.text <| text item ]
|
||||||
|
|
||||||
|
```
|
||||||
|
|
||||||
|
```elm
|
||||||
|
let
|
||||||
|
render item =
|
||||||
|
let
|
||||||
|
createHtml class tooltip =
|
||||||
|
[ Html.text <| text item
|
||||||
|
, Html.i
|
||||||
|
[ HtmlAttributes.class class
|
||||||
|
, HtmlAttributes.title tooltip
|
||||||
|
]
|
||||||
|
]
|
||||||
|
in
|
||||||
|
case warning item of
|
||||||
|
Just (Error tooltip) ->
|
||||||
|
createHtml "icon-error" tooltip
|
||||||
|
|
||||||
|
Just (Warning tooltip) ->
|
||||||
|
createHtml "icon-warning" (getWarningTooltip tooltip)
|
||||||
|
|
||||||
|
Nothing ->
|
||||||
|
[ Html.text <| text item ]
|
||||||
|
```
|
||||||
@ -1,4 +1,5 @@
|
|||||||
## Formatting
|
Elm - Formatting
|
||||||
|
================
|
||||||
|
|
||||||
Je kunt op deze manier een docstring toevoegen aan een elm functie:
|
Je kunt op deze manier een docstring toevoegen aan een elm functie:
|
||||||
|
|
||||||
|
|||||||
@ -1,4 +1,5 @@
|
|||||||
### Elm
|
### Elm
|
||||||
|
|
||||||
* [Formatting](./formatting)
|
* [Formatting](./formatting)
|
||||||
* [Maybe.map](./maybemap)
|
* [Maybe.map](./maybemap)
|
||||||
|
* [Don't Repeat Yourself](./dry)
|
||||||
@ -8,7 +8,7 @@ export const elmRoutes = languages.map(lang => {
|
|||||||
const main = <Route key={`${lang}-elm-main`} exact path={`/${lang}/software/elm/`} element={<ElmPage mdPath={`Software/elm/${lang}/main.md`} />} />
|
const main = <Route key={`${lang}-elm-main`} exact path={`/${lang}/software/elm/`} element={<ElmPage mdPath={`Software/elm/${lang}/main.md`} />} />
|
||||||
|
|
||||||
// Pages within Elm.
|
// Pages within Elm.
|
||||||
const md = ['formatting', 'maybemap'];
|
const md = ['formatting', 'maybemap', 'dry'];
|
||||||
const entries = md.map(entry => {
|
const entries = md.map(entry => {
|
||||||
const path = `/${lang}/software/elm/${entry}`;
|
const path = `/${lang}/software/elm/${entry}`;
|
||||||
const mdPath = `Software/elm/${lang}/${entry}.md`;
|
const mdPath = `Software/elm/${lang}/${entry}.md`;
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user