Add tags fields & add findByTags getter

This commit is contained in:
Kevin Van Der Werff
2019-06-22 17:23:29 +02:00
parent b40e3aeeb0
commit a57aa260bc
14 changed files with 382 additions and 185 deletions

View File

@@ -5,112 +5,134 @@
{
"title": "CSS Grid Generator",
"desc": "Visually create your css grid and export the code.",
"url": "https://cssgrid-generator.netlify.com/"
"url": "https://cssgrid-generator.netlify.com/",
"tags": []
},
{
"title": "Keyframes Editor",
"desc": "An insanely simple way to create CSS animations",
"url": "https://keyframes.app/editor/"
"url": "https://keyframes.app/editor/",
"tags": []
},
{
"title": "Flexbox Froggy",
"desc": "A game to learn Flexbox",
"url": "https://flexboxfroggy.com"
"url": "https://flexboxfroggy.com",
"tags": []
},
{
"title": "Flexbox Zombies",
"desc": "A course to learn Flexbox",
"url": "https://mastery.games/p/flexbox-zombies"
"url": "https://mastery.games/p/flexbox-zombies",
"tags": []
},
{
"title": "CSS Gridgarden",
"desc": "A game to learn Grid",
"url": "https://cssgridgarden.com"
"url": "https://cssgridgarden.com",
"tags": []
},
{
"title": "30 Seconds of Code",
"desc": "A curated collection of useful CSS snippets you can understand in 30 seconds or less.",
"url": "https://30-seconds.github.io/30-seconds-of-css/"
"url": "https://30-seconds.github.io/30-seconds-of-css/",
"tags": []
},
{
"title": "Grid by example",
"desc": "Everything you need to learn CSS Grid Layout",
"url": "https://gridbyexample.com/learn/"
"url": "https://gridbyexample.com/learn/",
"tags": []
},
{
"title": "BEM naming convention",
"desc": "Block Element Modifier is a methodology that helps you to create reusable components and code sharing in front-end development",
"url": "https://getbem.com/"
"url": "https://getbem.com/",
"tags": []
},
{
"title": "CSS Triggers",
"desc": "Overview of css attributes which trigger either layout, paint or composite. Good to know if you want to learn more about css performance.",
"url": "https://csstriggers.com/"
"url": "https://csstriggers.com/",
"tags": []
},
{
"title": "A complete guide to flexbox",
"desc": "A comprehensive guide to flexbox, focusing on all the different possible properties for the parent element (the flex container).",
"url": "https://css-tricks.com/snippets/css/a-guide-to-flexbox/"
"url": "https://css-tricks.com/snippets/css/a-guide-to-flexbox/",
"tags": []
},
{
"title": "Learn CSS layout",
"desc": "This site teaches the CSS fundamentals that are used in any website's layout (Unfortunately nothing abour display:grid yet).",
"url": "http://learnlayout.com"
"url": "http://learnlayout.com",
"tags": []
},
{
"title": "CSSmatic - box shadow generator",
"desc": "The ultimate box shadow generator",
"url": "https://www.cssmatic.com/box-shadow"
"url": "https://www.cssmatic.com/box-shadow",
"tags": []
},
{
"title": "AirBnB CSS / Sass Styleguide",
"desc": "A mostly reasonable approach to css and sass.",
"url": "https://github.com/airbnb/css"
"url": "https://github.com/airbnb/css",
"tags": []
},
{
"title": "Animista",
"desc": "CSS animations on demand.",
"url": "http://animista.net/"
"url": "http://animista.net/",
"tags": []
},
{
"title": "Use CSS Grids the right way",
"desc": "CSS Grid is robust, flexible, and a refreshing paradigm shift from other CSS layout systems. While these are selling points for Grid, they also make it hard to learn.",
"url": "https://vgpena.github.io/using-css-grid-the-right-way/"
"url": "https://vgpena.github.io/using-css-grid-the-right-way/",
"tags": []
},
{
"title": "CSS Protips",
"desc": "A collection of tips to help take your CSS skills pro.",
"url": "https://github.com/AllThingsSmitty/css-protips#readme"
"url": "https://github.com/AllThingsSmitty/css-protips#readme",
"tags": []
},
{
"title": "Flexbox Defense",
"desc": "Your job is to stop the incoming enemies from getting past your defenses. Unlike other tower defense games, you must position your towers using CSS!",
"url": "http://www.flexboxdefense.com/"
"url": "http://www.flexboxdefense.com/",
"tags": []
},
{
"title": "CSS Diner",
"desc": "Learn CSS selectors while playing a game.",
"url": "https://flukeout.github.io/"
"url": "https://flukeout.github.io/",
"tags": []
},
{
"title": "CSS Animation",
"desc": "CSS animation articles, tips and tutorials. Level Up Your CSS Animation Skills.",
"url": "https://cssanimation.rocks/"
"url": "https://cssanimation.rocks/",
"tags": []
},
{
"title": "JustREM",
"desc": "Easily and quickly convert pixel values into rem values.",
"url": "https://justrem.xyz/"
"url": "https://justrem.xyz/",
"tags": []
},
{
"title": "(Re)learn css layout",
"desc": "If you find yourself wrestling with CSS layout, its likely youre making decisions for browsers they should be making themselves. Through a series of simple, composable layouts, Every Layout will teach you how to better harness the built-in algorithms that power browsers and CSS.",
"url": "https://every-layout.dev/"
"url": "https://every-layout.dev/",
"tags": []
},
{
"title": "Interactive CSS box-model view",
"desc": "Learn CSS box-model by interractively changing the values.",
"url": "https://codepen.io/carolineartz/full/ogVXZj"
"url": "https://codepen.io/carolineartz/full/ogVXZj",
"tags": []
}
]
}