Happy New Years to all of you. I couldn’t be more glad that I have all of you next to me, I love you all. While 2020 was not the best year it sure was historic, something we’ll never forget. With that said thank god taht years over, we cannot come into this new year with negativity. Lets make it the best we can and live every day to its fullest ❤️

We made it to 7K 🙏🏻 thank you to each and everyone of you! We appreciate you all greatly, thank you for being such great members of this community and believing in what we’re trying to do as a company 💜

Learn CSS by playing games🎨

📌Grid Garden

🔹A game for learning CSS grid layout in 28 different levels



📌Unfold

🔹Not a kind of game but here you will learn all about transform property in a more interactive manner

📌Flexbox froggy

🔹In this game you will learn all about flexbox by writing small code snippet. Definitely check it out



📌CSS Diner

🔹In this game you will learn all about CSS selectors. It contains 32 levels. Try to master them



📌Flexbox Defense

🔹It covers the flex properties align-items, justify-content, flex-direction, align-self and order in 12 different levels

Learn Programming languages by playing games😍


📌CodeCombat

🔹The most engaging way to learn Python or JavaScript by writing small code snippets

📌Ruby Warrior

🔹If you want to learn Ruby, then Ruby Warrior is the game for you. There are beginner and intermediate tracks to suit your skill level

🔗📌CodinGame

🔹One of the great things about CodinGame is that you can play with friends or colleagues, and also enter international coding competitions. It supports 25 programming languages

🔗📌CodeMonkey

🔹It’s aimed at coding for kids, but it’s definitely fun for adults, too😁 I enjoyed it a lot

🔗📌Screeps

🔹Learn to code JavaScript by playing game

🔗📌Check IO

🔹Coding games for beginners and advanced programmers where you can improve your coding skills by solving engaging challenges and fun task using Python and TypeScript

🔗📌Cyber-dojo

🔹Practice your JavaScript, Java, Python, PHP, Ruby, etc skills here on the virtual space

🔗📌Untrusted

🔹Untrusted is a JavaScript adventure game that tests your JavaScript skills to solve problems

❤️We will make coding easier for everyone. Add more on comments👇

Are you planning to learn programming in 2021, but don't know which language to start with?

I'm here to help you out

1. C

🔸Database systems
🔸Graphics packages
🔸Word processors
🔸Spread sheets
🔸Operating system development
🔸Compilers and Assemblers
🔸Network drivers
🔸Interpreters2.

C++

🔸Games
🔸GUI Based Applications
🔸Database Software
🔸Operating Systems
🔸Browsers
🔸Advanced Computation And Graphics
🔸Cloud/Distributed System
🔸Compilers
🔸Banking Applications

3. Java

🔸Android Apps
🔸Server Apps at the Financial Services Industry
🔸Big Data technologies
🔸Backend
🔸High-Frequency Trading Space
🔸Web-based Applications
🔸Internet of Things
🔸Cloud
🔸Augmented reality

4. Python

🔸Artificial Intelligence and Machine Learning
🔸Web development
🔸Game Development
🔸Biology and Bioinformatics
🔸Computer Vision and Image Processing
🔸Data Science
🔸Scientific and Numeric Applications
🔸Shells of operating systems


5. JavaScript

🔸Scripting
🔸Web development
🔸Data Mining
🔸PWA
🔸Embedded devices
🔸Server applications
🔸Game development
🔸Machine Learning
🔸AR and VR

Free Web Development Resources

Learning Platforms:
⧩ freecodecamp.org
⧩ codecademy.com
⧩ javascript30.com
⧩ frontendmentor.io
⧩ testautomationu.applitools.com
⧩ coursera.org
⧩ khanacademy.org
⧩ sololearn.com

Free Hosting:
⧩ netlify.com
⧩ firebase.google.com
⧩ aws.amazon.com
⧩ heroku.com
⧩ pages.github.com
⧩ vercel.com
⧩ surge.sh
⧩ render.com
⧩ docs.gitlab.com/ee/user/project/pages

Coding Challenge Platforms:
⧩ codewars.com
⧩ topcoder.com
⧩ codingame.com
⧩ hackerrank.com
⧩ projecteuler.net
⧩ coderbyte.com
⧩ codechef.com
⧩ exercism.io
⧩ leetcode.com
⧩ spoj.com

Freelancing platforms:
📌 toptal.com
📌 upwork.com
📌 freelancer.com
📌 peopleperhour.com
📌 simplyhired.com
📌 envato.com
📌 guru.com
📌 fiverr.com
📌 hireable.com
📌 6nomads.com

List of websites to find remote jobs:
📌 flexjobs.com
📌 remote.co/remote-jobs
📌 justremote.co
📌 weworkremotely.com
📌 remoteok.io
📌 jobspresso.co
📌 europeremotely.com
📌 wfh.io

Photos:
📷 unsplash.com
📷 pixabay.com
📷 pexels.com

Illustrations:
⧩ undraw.co/illustrations
⧩ drawkit.io
⧩ icons8.com/ouch
⧩ iradesign.io
⧩ interfacer.xyz
⧩ blush.design

Icons:
⧩ fontawesome.com
⧩ flaticon.com
⧩ icons8.com
⧩ material.io/resources/icons
⧩ iconmonstr.com

Fonts:
✍️ fonts.google.com
✍️ fontspace.com
✍️ 1001fonts.com
✍️ fontsquirrel.com

Youtube Channels:
🔗 Traversy Media
🔗 FreeCodeCamp
🔗 The Net Ninja
🔗 Google Chrome Developers
🔗 The New Boston
🔗 Derek Banas
🔗 Academind

Podcasts:
🔗 Syntax
🔗 Fullstack radio
🔗 The Changelog
🔗 The Laracasts Snippet
🔗 Front End Happy Hour
🔗 JavaScript Jabber Archives
🔗 Commit Your Code!
🔗 Shop Talk
🔗 Ladybug Podcast
🔗 CodePen Radio
🔗 JAMStack Radio
🔗 Modern Web

Code Editors:
🚀 Visual Studio Code [VS Code]
🚀 Sublime Text
🚀 Atom
🚀 Brackets
🚀 Vim

Color Palettes:
🎨 coolors.co
🎨 colorhunt.co
🎨 paletton.com
🎨 color-hex.com
🎨 mycolor.space

UI Inspiration:
⧩ uimovement.com
⧩ uigarage.net
⧩ collectui.com
⧩ httpster.net

Docs:
🔥 developer.mozilla.org
🔥 w3schools.com
🔥 w3docs.com
🔥 devdocs.io
🔥 free-for.dev

##Animation Libraries:
⧩ CSShake
⧩ Animate.css
⧩ AnimeJS
⧩ GreenSock (GSAP)
⧩ Magic Animations
⧩ Hover css
⧩ AniJS
⧩ Wicked CSS
⧩ Tuesday
⧩ Mo.js
⧩ Bounce.js

Charts / Data Visualization:
📊 Chart.js
📊 D3.js
📊 three.js

Chrome Extensions:
🔖 Web Developer
🔖 CSSViewer
🔖 Wappalyzer
🔖 JSONView
🔖 Lorem Ipsum Generator

Website Optimization Tools:
⚡ Google PageSpeed Insights
⚡ GTmetrix
⚡ WebPageTest
⚡ Yslow



FREE Cloud Services (including Hosting) ☁️

⧩ https://t.co/kwPBPH9w1d
⧩ https://t.co/rFlmkCHw9j
⧩ https://t.co/unUqlPX99q
⧩ https://t.co/wenlxmgQbj
⧩ https://t.co/6j4hqrk6lT
⧩ https://t.co/zWt5v8BuaG
⧩ https://t.co/yxYxELP5JA
⧩ https://t.co/st2HF14KW9
⧩ https://t.co/unUqlPX99q
⧩ https://t.co/qTdzsokir8
⧩ https://t.co/GvDLhM8tSO
⧩ https://t.co/w8Gll62OGM
⧩ https://t.co/QC38DLnRbS
⧩ https://t.co/ly6Gqog9rY

100 free tools and resources you're gonna love

Free stuff is always exciting. But, what if it is free and awesome?

Let's start!
1.UI Garage
Daily UI inspiration & patterns for designers, developers to find inspiration, tools and the best resources for your project.

Link: uigarage.net

2. Remove bg
Remove Image Background: 100% automatically – in 5 seconds – without a single click – for free.

Link: remove.bg

3. uiGradients
A handpicked collection of beautiful color gradients for designers and developers.

Link: uigradients.com

4. Blender
Free and Open 3D Creation Software.

Link: blender.org

5. Edabit
Learn to code with fun, bite-sized challenges. Gain XP, unlock achievements and level up. It's like Duolingo for learning to code.

Link: edabit.com

6. Coolors
Generate or browse beautiful color combinations for your designs.

Link: coolors.co

7. loading.io
Build Your Ajax Loading Icons, Animated Text and More with SVG / CSS / GIF / PNG !

Link: loading.io

8. DevSamples
DevSamples is a list of code samples for you to copy and paste into your projects as needed. The primary focus is on web development, but there are samples from a variety of languages.

Link: devsamples.com

9. Lorem Picsum
Lorem Ipsum... but for photos

Link: picsum.photos

10. Netlify
Deploy modern static websites with Netlify. Get CDN, Continuous deployment, 1-click HTTPS, and all the services you need. Get started for free.

Link: netlify.com

11. Pxfuel
Millions of public domain stock photos released under creative common zero lincense, all are free for commercial use.

Link: pxfuel.com

12. Font Awesome
The world’s most popular and easiest to use icon set just got an upgrade. More icons. More styles. More Options.

Link: fontawesome.com

13. GTmetrix
GTmetrix is a free tool that analyzes your page's speed performance. Using PageSpeed and YSlow, GTmetrix generates scores for your pages and offers actionable recommendations on how to fix them.

Link: gtmetrix.com

14. Resume.com
The Best Free Resume Builder No gimmicks. At Resume.com, you can build a professional resume that highlights your best qualities so you can land your dream job without any out of pocket expenses. Applying for jobs shouldn't cost you money.

Link: resume.com

15. daily.dev
daily.dev is the easiest way to stay updated on the latest programming news. It's a feed of articles that's ranked by a massive community of developers. Get the best content from the top tech publications on any topic you want. All in one browser extension

Link: daily.dev

16.DevDocs
Fast, offline, and free documentation browser for developers. Search 100+ docs in one web app: HTML, CSS, JavaScript, PHP, Ruby, Python, Go, C, C++…

Link: devdocs.io

17. Feather Icons
Feather is a collection of simply beautiful open source icons. Each icon is designed on a 24x24 grid with an emphasis on simplicity, consistency and readability.

Link: feathericons.com

18. shortcode.dev
A collection of useful snippets and code examples. Elements, attributes and selectors.

Link: shortcode.dev

19. Canva
Create beautiful designs with your team. Use Canva's drag-and-drop feature and layouts to design, share and print business cards, logos, presentations and more.

Link: canva.com

20. Mockuper.net
mockuper, the free mockups generator to create custom images to show your awesome works.

Link: mockuper.net

21. CSS Nectar
CSS Nectar is a css website design showcase for web designers and developers. Every day we select the best of the web design and add it to our gallery.

Link: cssnectar.com

22. BGJar
Free svg background generator for your websites, blogs and apps.

Link: bgjar.com

23. Photopea
Photopea Online Photo Editor lets you edit photos, apply effects, filters, add text, crop or resize pictures. Do Online Photo Editing in your browser for free!

Link: photopea.com

24. Vercel
Deploy web projects with the best frontend developer experience and highest end-user performance.

Link: vercel.com

25. fun-javascript-projects
Learn Javascript for free in a practical, project based approach.

Link: fun-javascript-projects.com

26. Flaticon
3743500+ Free vector icons in SVG, PSD, PNG, EPS format or as ICON FONT. Thousands of free icons in the largest database of free vector icons!

Link: flaticon.com

27. Awesome Python
A curated list of awesome Python frameworks, libraries and software.

Link: awesome-python.com

28. CSS Reference
CSS Reference is a free visual guide to CSS. It features the most popular properties, and explains them with illustrated and animated examples.

Link: cssreference.io

29. Sidebar.io
The five best design links, every weekday.

Link: sidebar.io

30. Grid by Example
Everything you need to learn CSS Grid Layout.

Link: gridbyexample.com

31. Heroicons
Beautiful hand-crafted SVG icons, by the makers of Tailwind CSS.

Link: heroicons.com

32. Latency
Free global latency performance testing tool.

Link: latency.apex.sh

33. We Work Remotely
Remote jobs in design, programming, marketing and more.

Link: weworkremotely.com

34. Unsplash
Beautiful, free images and photos that you can download and use for any project. Better than any royalty free or stock photos.

Link: unsplash.com

35. Simple Icons
1400+ Free SVG icons for popular brands.

Link: simpleicons.org

36. CSS Stats
CSS Stats provides analytics and visualizations for your stylesheets.

Link: cssstats.com

37. Squoosh.app
Compress and compare images with different codecs, right in your browser.

Link: squoosh.app

38. Fast design
The adaptive interface system for modern web experiences.

Link: fast.design

39. Tabler Icons
800+ Highly customizable & free SVG icons.

Link: tablericons.com

40. unDraw
The design project with open-source illustrations for any idea you can imagine and create. Create beautiful websites, products and applications with your color, for free.

Link: undraw.co

41. Figma
Build better products as a team. Design, prototype, and gather feedback all in one place with Figma.

Link: figma.com

42. Hashnode
Hashnode is a free content creation platform and community that allows you to publish articles on your own domain and helps you stay connected with a growing developer community.

Link: hashnode.com

43. Free CSS
Free CSS has 3133 free website templates, all templates are free CSS templates, open source templates or creative commons templates.

Link: free-css.com

44. DrawKit
Free vector SVG illustrations for you to use on your next project, no attribution required! Vector illustrations, packs, icons and more.

Link: drawkit.io

45. Public APIs
A collective list of more than 1000 Free Public and Open REST APIs for developers like movie APIs, Anime APIs, weather APIs, music APIs, games and comics APIs, currency APIs, sports APIs, science APIs, open data APIs, etc.

Link: public-apis.io

46. CSS.gg
Pure CSS icons library, Customizable & Retina-Ready built 100% in pure CSS, SVG, SVG Sprite, styled-components, Figma and Adobe XD. Easy integration: Embed, NPM & API.

Link: css.gg

47. Jr.DevJobs
Jobs for Junior Developers

Link: jrdevjobs.com

48. Notion
A new tool that blends your everyday work apps into one. It's the all-in-one workspace for you and your team.

Link: notion.so

49. Compresspng.com
PNG compression and optimization tool to compress PNG images into PNG-8 format with transparency support

Link: compresspng.com

50. Compressor.io
Optimize and compress JPEG, PNG, SVG, GIF and WEBP images online. Compress, resize and rename your photos for free.

Link: compressor.io

1. Caniuse.com
"Can I use" provides up-to-date browser support tables for support of front-end web technologies on desktop and mobile web browsers.

Link: caniuse.com

2. Javascript.info
Modern JavaScript Tutorial: simple, but detailed explanations with examples and tasks, including: closures, document and events, object oriented programming and more.

Link: javascript.info

3. Diffchecker
Diffchecker is an online diff tool to compare text to find the difference between two text files.

Link: diffchecker.com

4. Free for developers
This is a list of software (SaaS, PaaS, IaaS, etc.) and other offerings that have free tiers for developers.

Link: free-for.dev

5. Stormkit
Stormkit is an infrastructure provider for modern javascript applications which is strongly integrated with popular Git providers.

Link: stormkit.io

6. PythonAnywhere
Host, run, and code Python in the cloud: PythonAnywhere.

Link: pythonanywhere.com

7. Regex101
Online regex tester, debugger with highlighting for PHP, PCRE, Python, Golang and JavaScript.

Link: regex101.com

8. Quant-UX
Design, Test and Learn in one tool! Quant-UX Low Code capabilities allow convert Prototypes into production systems.

Link: quant-ux.com

9. Glitch
Simple, powerful, free tools to create and use millions of apps.

Link: glitch.com

10. Frontend Mentor
Improve your front-end skills by building real projects. Solve real-world HTML, CSS and JavaScript challenges whilst working to professional designs.

Link: frontendmentor.io

11. Smashing Magazine
Smashing Magazine — for web designers and developers.

Link: smashingmagazine.com

12. FontPair
Font Pair helps designers pair Google Fonts together. Beautiful Google Font combinations and pairs.

Link: fontpair.co

13. Codewars
Codewars is where developers achieve code mastery through challenge. Train on kata in the dojo and reach your highest potential.

Link: codewars.com

14. Westryve
Find communities for PHP, Laravel, HTML & CCS, Python, .NET and many more.

Link: westryve.com

15. Remote.co
Remote Work: Jobs, Companies & Virtual Teams - Remote.co

Link: remote.co

16. Web.dev
Get the web's modern capabilities on your own sites and apps with useful guidance and analysis from web.dev.

Link: web.dev

17. BundlePhobia
Bundlephobia helps you find the performance impact of adding a npm package to your front-end bundle.

Link: bundlephobia.com

18. Scrimba.com
Scrimba is a fun and fast way of learning to code! Our interactive courses and tutorials will teach you React, Vue, Angular, JavaScript, HTML, CSS, and more.

Link: scrimba.com

19. Dev.to
A constructive and inclusive social network. Open source and radically transparent.

Link: dev.to

20. Heroku
Heroku is a platform as a service (PaaS) that enables developers to build, run, and operate applications entirely in the cloud.

Link: heroku.com

21. Animista.net
Animista is a place where you can play with a collection of ready to use CSS animations, tweak them and download only those you will actually use.

Link: animista.net

22. HTTP Status Codes
HTTP Status Code directory, with definitions, details and helpful code references.

Link: httpstatuses.com

23. The Coding Interview
Everything you need to ace the coding interview all in one place. Crack the coding interview with just 5 minutes of preparation a day.

Link: thecodinginterview.com

24. Learn-anything.xyz
Search Interactive Mind Maps to learn anything.

Link: learn-anything.xyz

25. Responsively App
A dev-tool that aids faster and precise responsive web development.

Link: responsively.app

26. Colormind
Generate color combinations in one click. Colormind creates cohesive color schemes using a deep neural net.

Link: colormind.io

27. teachyourselfcode.io
Learn to code for free with curated video tutorials!

Link: teachyourselfcode.io

28. Render
Render is a unified platform to build and run all your apps and websites with free SSL, global CDN, private networks and auto deploys from Git.

Link: render.com

29. Carbon.sh
Carbon is the easiest way to create and share beautiful images of your source code.

Link: carbon.now.sh

30. Regex Pal
Test your Javascript and PCRE regular expressions online.

Link: regexpal.com

31. JSONLint
JSONLint is the free online validator and reformatter tool for JSON, a lightweight data-interchange format.

Link: jsonlint.com

32. W3Layouts
Design a great looking website with our free website templates. All our web templates are responsive, built with Bootstrap, HTML, CSS, and JS.

Link: w3layouts.com

33. Freepik
Millions of Free Graphic Resources. ✓ Vectors ✓ Stock Photos ✓ PSD ✓ Icons ✓ All that you need for your Creative Projects.

Link: freepik.com

34. Mixkit
Free Stock Video Footage, Stock Music & Premiere Pro Templates for your video project.

Link: mixkit.co

35. Unscreen
Remove the background of any video - 100% automatically, online & free! Goodbye Greenscreen. Hello Unscreen.

Link: unscreen.com

36. Avataaars Generator
A free online avatar generator for anyone to make their beautiful personal avatar easily!

Link: getavataaars.com

37. Remix Icon
Remix Icon is a set of open source neutral style system symbols elaborately crafted for designers and developers. All of the icons are free to use for both personal and commercial.

Link: remixicon.com

38. Ikonate
Customise, adjust and download free vector icons. Ikonate is an adaptable set of optimised, accessible SVG icons that use can easily use in both development and design apps such as Sketch and Photoshop. Ready to use as images, inline SVGs or SVG sprites.

Link: ikonate.com

39. Open Doodles
A library of sketchy illustrations of people free for personal and commercial use.

Link: opendoodles.com

40. Kite
Code faster with Kite's AI-powered autocomplete plugin for over 16 programming languages and 16 IDEs, featuring Multi-Line Completions. Works 100% locally.

Link: kite.com

41. Devhints
A ridiculous collection of web development cheatsheets.

Link: devhints.io

42. Wappalyzer
Find out the technology stack of any website. Create lists of websites and contacts by the technologies they use.

LInk: wappalyzer.com

43. Tailwind Components
Tailwind CSS examples from components by the community. Tailwind chart, grids, inputs, forms, templates and much more.

Link: tailwindcomponents.com

44. grammarly.com
Communicate With Impact. Ensure Everything You Write Comes Across The Way You Intend. Present Your Best Self Every Time You Type. Make Your Writing Clear and Engaging. Eliminate grammar errors. Easily improve any text.

Link: grammarly.com

45. Wave
Free invoicing & accounting software with credit card processing & payroll services.

Link: waveapps.com

46. Clockify
Time tracking software used by millions. A simple time tracker and timesheet app that lets you track work hours across projects.

Link: clockify.me

47. Untools
Collection of thinking tools and frameworks to help you solve problems, make decisions and understand systems.

Link: untools.co

48. Free Logo Maker
Make a custom logo in minutes using our free online app. Design your own logo for a website or business with Namecheap.

Link: namecheap.com/logo-maker

49. TinyPNG
Make your website faster and save bandwidth. TinyPNG optimizes your PNG images by 50-80% while preserving full transparency!

Link: tinypng.com

50. 1loc
Favorite JavaScript single line of code.

Link: 1loc.dev

You want to become a developer in 2021.

And don't have a CS degree. No worries!

You can learn everything on the internet today.

1- Open Source Society University

OSSU curriculum is a complete education in computer science.

Students can work through the curriculum alone or in groups, in order or out of order.
Link here

The curriculum is designed as follows:

- Intro CS
- Core CS
- Advanced CS
- Final Project

Nearly all course material is available for free.

However, some courses may charge money for assignments/tests/projects to be graded.


2- Path to free self-taught education in Computer Science!

Introduction to Programming

If you've never written a for-loop, or don't know what a string is in programming, start here. This course is self-paced.

Python for Everybody:
Link here


3 - Introduction to Computer Science and Programming Using Python

Link here


4- Introduction to Logic Offered By Stanford University

Link here



5- CS50's Introduction to Computer Science

An introduction to the intellectual enterprises of computer science and the art of programming by Harvard University.

Link here


6- Software Engineering: Introduction

Learn how to apply engineering principles, such as Agile, to build a full-stack software system by university of British Columbia.

Link here


7- Data Structures and Algorithms Specialization

Master Algorithmic Programming Techniques. Learn algorithms through programming and advance your software engineering or data science career, Offered By University of California San Diego
Link here


8- Computer Architecture

You will learn to design the computer architecture of complex modern microprocessors.

All the features of this course are available for free. It does not offer a certificate upon completion.
Link here

🎲 Quiz 'Beginners'
🖊 8 questions · ⏱ 45 sec

🎲 Quiz 'Beginner's TEST 2'
For Frontend Developers who is just starting learning HTML5 , JavaScript and CSS , or has only recently started . Don't forgot to join @WebDevStuff
🖊 8 questions · ⏱ 45 sec

🎲 Quiz 'Beginner's TEST 3'
For Frontend Developers who is just starting learning HTML5, JavaScript and CSS, or has only recently started. Don't forgot to join @WebDevStuff
🖊 8 questions · ⏱ 45 sec

🎲 Quiz 'Beginner's TEST 4'
For Frontend Developers who is just starting learning HTML5, JavaScript and CSS, or has only recently started. Don't forgot to join @WebDevStuff
🖊 8 questions · ⏱ 45 sec

If Anyone Wants A Website Being Made, contact the group Admins and owners. There is a team of WebdevChat's official devs. Please do not deal with unverified people. There might be scammers, Also if youre a developer and want to work, Ping @Olivia2016.

10 Hot HTML tags to use right now.

HTML elements are the building blocks of the web, and there are tons of different HTML tags out there to choose from, so how do you ensure you're using the right ones?

Let me highlight the tags you should be using to build your sites the correct way.



1. <details> and <summary>

Whenever something on a page needs to be interactive, JS is often the first port of call. Showing & hiding content can be as straightforward as toggling a class.
But this behavior is already available, with no added page weight, right inside HTML.


2. <small>

This tag can distinguish supplementary information usually found in small print such as disclaimers or copyright notices.

This would be used for inline content, rather than a full block-level <aside>.


3. <output>

An <output> denotes where the result of a calculation will be displayed.

Any content inside an <output> element is read aloud by screen readers as it changes.

<input type=”range” id=”slider” min=”0” max=”100” value=”40” />
<output for=”slider”>40</output>



4. <code>

When writing content that should be interpreted as computer code, the <code> element will separate it from the rest of the text. By default, it is styled using a monospace font.

The content can be shown by providing the <code>open</code> attribute.


5. <template>

Most languages have some way to recreate common code.

In HTML, this task is achieved using the <template> element.

<template>
<tr>
<td><!-- Name --></td>
<td><!-- Email address --></td>
</tr>
</template>


6. <wbr>

While using overflow-wrap or word-break CSS properties gives some control over line breaks, they can end up either breaking in unsuitable places or not breaking at all.

https://<wbr>www<wbr>.theankurtyagi<wbr>.com/



7. <data>

Sometimes there can be data that makes sense to humans, but machines can find it difficult to parse. The <data> element provides a hook for them and provide an alternative meaning with the value attribute.

<data value=”9781484254516”>Web Inclusion Accessibility</data>


9. <datalist>

A <datalist> element defines options for other controls, such as an <input>.

<datalist id=”meal-type”>
<option value=”Twitter”>
<option value=”FB”>
<option value=”Insta”>
</datalist>



10. <caption>

The <caption> element should be the first inside the <table> it describes. By default, it appears above the table, but it can be adjusted using the caption-side CSS property.

<table>
<caption>How many times a scoreline occurred</caption>
[…]
</table>

1) #HTML & #CSS

2) #Git