teleren/devto huggingface dataset:
The ultimate Github project template
Tags: github, showdev, productivity, opensource
Published: 2021-04-01 17:11:51

**Introduction**

Most of us spend countless hours on multiple open-source projects and sometimes we are doing the same basic work in all of them; design catchy documentation in the readme file, write an *issue* and *pr* templates, etc.

When I discovered the Github templates I soon realized I wanted to do a global and unique template to use in all my future projects.

---

**Quick overview**
I want to show you how you could improve your new repositories using this template and what it contains:


Organize your issues and improve your productivity with these 9 issue templates. 
![image](https://i.imgur.com/SDJixBz.png)


Create your project with an essential readme structure and some cool **badges** (When downloading the template all the texts and badges will be personalized with your project details) 
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/o5mvzkn565ynhpkuzpo5.png)

19 **issue labels** to organize your issues
![image](https://i.imgur.com/dS91k6R.png)

Log all your changes in your new CHANGELOG file
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s7daa5uwr36sr3azfgv1.png)
 

Get control over your community
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5whoz1c443m82xwopzb5.png)

--- 

**Installation**

If you liked it, maybe it's time for trying it!

1. To create a new repository from this template [generate your new repository from this template](https://github.com/Josee9988/project-template/generate)
for more information or guidance, follow the [Github guide](https://docs.github.com/en/github/creating-cloning-and-archiving-repositories/creating-a-repository-from-a-template).
2. Clone your repo and `cd` into it.
3. **Execute** the `SETUP_TEMPLATE.sh` shell script to **customize** the files with your data.
  
    ```bash
    bash SETUP_TEMPLATE.sh # execute the setup script. additional parameters [Username] [Project-Name] [Email]
    ```

    Or you can also do it like this:

    ```bash
    chmod u+x SETUP_TEMPLATE.sh && ./SETUP_TEMPLATE-sh # another way additional parameters [Username] [Project-Name] [Email]
    ```

    Additionally, watch *[this video](https://asciinema.org/a/404568)* to see **how to execute the script**.
(the script will automatically auto-detect your mail, project name and username, but you can change them if they are wrong :D)

4. **Review** every single file and **customize** it as you like.
5. Build your project. 🚀

---

Thanks for reading, for more information please check the [repository](https://github.com/Josee9988/project-template) :D
Lessons from a failed programming test
Tags: cpp, todayilearned
Published: 2021-04-01 16:59:02

# Background

A couple days ago, I took a C++ programming test as part of a company's hiring process. In the interest of *not* violating the secrecy I agreed to, I'm going to be vague about the exact nature of the test and the company.

The task was fairly simple: Implement an operation on a generic data-structure they use frequently. 

There were four constraints the solution had to meet:
1. Type specifications - strict adherence to the information given about the types we're working with
2. Correctness - All given inputs produce correct outputs
3. Canonicity - Don't use more private data than you need to to maintain the data-structure
4. Runtime - Don't use more than one O(log N) operation

They're checked in order, so if you fail one of them, you don't get feedback about the rest.

My first attempt succeeded on type spec and correctness, but failed on canonicity. My second attempt failed on the type spec because of fixes I had made to fix my canonicity issue. A third attempt was not available.

# Lessons learned

I learned a few things from this, and I wanted to write it out both for myself and whoever applies for a programming job next. This was a C++ test, but these lessons should be more broadly applicable.

## Make sure you understand the problem

On my first attempt, I didn't pay enough attention to the canonicity constraint. My solution was simple and produced the correct output with only a few lines of code. I didn't take the time to reason about how multiple operations might violate canonicity, or how even an operation that wouldn't have any effect on the output would pollute the backing data structure. 

Take the time. Write another function to introspect on your backing data structure and make sure it's not storing unneeded data. Go even further and write an automated check for it.

## Set up your tests properly

Let's go back to the type specifications. We're given two type variables, `K` and `V`. `K` *only* supports copying, assigning, and less-than comparing. `V` *only* supports copying, assigning, and equality checking.

In testing, the smart thing would be to create basic wrapper types that support only those operations. That way, if you accidentally use an unsupported operation, you get a glaring warning from the compiler before you submit. 

This is what tripped me up on my second attempt. I tried checking that a value of type `V` was *inequal* to another with `!=`. `!=` is not a supported operation on type `V`. The type I was using for `V` while testing was a `char`, which does support `!=`, so the compiler didn't catch it.

# Conclusion

Remember these. Don't make my mistakes. Be thorough. I lost this opportunity, and the soonest they'll take another application from me is a couple of years from now.
Simple UI Component Library Project Based On Tailwind UI Components Design
Tags: css, design, html, uicomponents
Published: 2021-04-01 16:58:20

Hey Everyone👋!
Welcome to my first ever online blog post. I have always been a fan of web design and believed in creating something elegant and beautiful but functional at the same time.

Several months ago I discovered a utility first framework called [Tailwind CSS](http://tailwindcss.com/) and after using it in a few of my projects I was hooked to the concept. Now from the start of my career, I have always been a front-end developer responsible for bringing the design files to life in a browser. Even though I consider myself to be quite good😅 at recreating those UI files I suck at creating a UI from scratch. A few months ago I learned that the founders of Tailwind CSS have launched a UI Components library called [Tailwind UI](https://tailwindui.com/) built using Tailwind CSS.

After going through their UI components repository I was amazed by their simplistic design having functional use. So I challenged myself to recreate those UI components but only using CSS/SCSS. 

At the point of writing this blog post, I have around 125 UI components on the [website](http://ui-component-library.netlify.app/). Following are few UI component examples.

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p2cdd8uut6gy0ju5xazs.png)
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ldvno8kdz5quxg1kuudl.png)
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u91yf2rdu2bq7ygxb9qb.png)   

Now please note that this project is still in development and I will keep on adding new components from Tailwind UI whenever I have some spare time. Drop in a comment if you liked/disliked anything about those components.

Peace✌️
The Select keyword in Golang
Tags: go, webdev, systems, beginners
Published: 2021-04-01 16:51:56

:bookmark_tabs: 1. [Theory](#the-select-statement)
:computer: 2. [Code](#show-me-the-code)
:pencil: 3. [Conclusion](#conclusion)

## The select statement

>The _select_ statement in Go looks like a _switch_
statement but for `channels`

---

1. Each case inside a _select_ holds a channel receive or send.
2. _Select_ ***waits*** until one case is ready and then runs it and its associated case statement.
3. It chooses **one** at _random_ if multiple channels are ready.
4. It will ***block*** until one of the channels is ready.
5. I think the select statement is one of the most important part of the Go concurrency model.

Please let me know if you notice any mistakes or I forgot something important :sweat_smile:

## Show me the code

Let's code a _classical program_ that's generate a Multiplication Table.
Take a look at the main function:

```golang
type message struct {
	text   string
	number int
}

func main() {
	msg := make(chan message)
	exit := make(chan bool)

	go readInput(msg, exit)
	for {
		select {
		case m := <-msg:
			validateInputAndGetNumber(&m)
			printMultiplicationTable(m)
			fmt.Print("˲Give me a number or exit: ")
		case <-exit:
			fmt.Println("Exiting program...")
			os.Exit(1)
		}
	}
}
```
1. `message struct` is the type of channel that I use to communicate between goroutines. There are just two goroutines in this program, the execution of ***main function*** and the execution of ***readInput function*** and yes, the main function is executed as a goroutine by go runtime.
2. Instantiate two channels: `msg` and `exit` I hope the variable name is self-explanatory:grin: .
3. `go readInput(msg, exit)` starts the goroutine to read the user input stdin data sending to the ***msg*** channel.
4. `for { select { ... } }`  it starts an infinite loop with the for keyword. This way we can keep listening to both channels with _select_ forever.

>Therefore the goroutine executed by `go readInput(msg, exit)` is sending data through the `msg` and `exit` channels, and the goroutine executed by `main()` is reading these channels and then when one of the channels is ready, that operation will proceed, and its corresponding statements.

The running code seems like this: 

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/llly3zy20mozbny6xhwv.gif)

{% github iamseki/dev-to/ no-readme %}
## Conclusion

My goal with this simple program is to demonstrate how we can use the select statement to handle incoming data from channels in a fancy way. I hope it could be helpful, especially for new Gophers :smile:
Vue JS - Differences between Computed and Watch
Tags: vue, beginners, javascript
Published: 2021-04-01 16:24:11

When I started to code in Vue and had to react to changes, I always asked myself the same question: computed or watch? 🤔️. The both seem to do the same, right? However, a computed property may be better than a watcher in some cases or vice versa.

**Computed**

We can think of a computed property as a normal property, but with the difference that Vue automatically evaluates its value every time one of its dependencies is changed.  For instance:

``` javascript
computed: {
  total() {
    return this.price * this.quantity;
  }
}
``` 

The `total` property will be calculated every time the `price` or the `quantity` changes.

**Watch**

A watcher is basically a function that Vue automatically executes when the watched property changes. If we take the above example, we could do it as follows:

``` javascript
watch: {
  quantity(val) {
    this.total = this.price * val;
  },
  price(val) {
    this.total = this.quantity * val;
  }
}

``` 

This works, but it's a lot of code. We would have to add a third watcher if the `total` property also depended on the `tax`. This is the main reason why it's a better idea to use a computed property instead.

While computed properties are more appropriate in most cases, watchers are more powerful and allow us to perform complex operations such as HTTP calls or execute some asynchronous logic that wouldn't be possible with a computed property.

Suppose we want to get the movies in which an actor appears. We could do it in the following way:


``` javascript
export default {
  data() {
    return {
      actorId: null,
      movies: [],
    };
  },
  methods: {
    getMovies() {
      // http request
      axios.get(`movies/actor/${this.actorId}`)
      .then(resp => {
        this.movies = resp.data;
      });
    }
  },
  watch: {
    actorId(val) {
      if(val) this.getMovies();
    }
  }
}
```

Another use case for a watcher is when we need to watch a data property until it reaches a specific value, and only then do something. For instance:


``` javascript
watch: {
  quantity(val) {
    if (val > this.stock) {
      this.error = true;
      this.errorMessage = `We only have ${this.stock} units`;
    }
  },
}
``` 


**Conclusion**

Computed properties and watchers have different use cases. It would be a better idea to use a computed property whenever we need to calculate a value based on other properties, considering that Vue will reevaluate the property every time any of its dependencies is changed and we will not need a custom watcher for each dependency. But a watcher would be better if we need to do something more generic than just get a value, such as HTTP calls, store data in local storage, set a timer, or whatever we couldn't do with computed properties.
36 Hours🕗->🕘
Tags: showdev, beginners, computerscience
Published: 2021-04-01 16:05:46



# The Hackathon 🐱‍💻 


A 36 hours ⏳ long run hackathon 🐱‍💻 organized by **DSC MAIT** 👨‍🏫 named **HACK THE SOLUTION | GOOGLE SOLUTION CHALLENEGE.** 👨‍💻 With **550+** registrations and **117** teams, the event held online.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kxpurytmpw63b7yds1ox.png)


# A Win 🥇🏆

We **Team Garuda** won the hackathon 🥳🎉 and we were so happy 😃 to be a winner and that our idea 💡 and solution 👨‍🏫 was chosen to be the best and the **36 Hours** long effort ⚒ was equally appreciated, that gave us new boost 🚀 and new encouragement 💪 to conquer more.

#### The winning moment!!! ✨🎆

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/egautx7iboi105gksm1c.jpeg)

#### The Team 👨‍💻👨‍🏫👨‍🔬

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xtc3pxv7856kmlhk5p6d.jpeg)



# Experience 🧐🤓

Despite being an online virtual event I would like to appreciate the work that was done by **DSC MAIT Management** to make this event a great success. 📶

The efforts they had put in to do such a long event is **praise worthy**. Everything from the timing and the handling was just perfect. I would like to thank **DSC MAIT** to hold such a good event and give us the platform to learn 🏫 and explore 🔍  more about latest technologies. ⚙👨‍💻

The **mentorship** 👨‍🏫👩‍🏫 we received was of a quality that allowed us to implement our idea far more better and make our solution  more **effective** and **efficient**.🚄



# Special Appearance 👀😍

Well, after the **winning** I saw that I was chosen to be the **Best Performing Student Ambassador** 🎊🥳 that was another moment of celebration, my whole was delighted and happy that our team topped in all domains. 🎆✨

#### Mention ❄

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wglwug5qq0xp8fezxk5p.jpeg)



# Looking forward 🔮

The hackathon is finished now and we have won it but the thing that matters now is how we are going look ahead 🔍 and develop our solution 💡 more further in the future adding various features and all.



##### That's all from my side 🎩, Happy Learning 🏫👨‍🏫!!!
tl8.io is out
Tags: tl8
Published: 2024-04-30 14:55:29

---
title: tl8.io is out
published: true
date: 2021-04-01 15:58:31 UTC
tags: tl8
canonical_url: 
---

 ![tl8.io is out](https://blog.merckx.fr/content/images/2021/04/feliphe-schiarolli-ZB9Wqygiqzc-unsplash.jpg)

A few weeks ago, I started to work on a project that solves a very specific problem. I wanted to reduce the amount of effort required to change text in an Angular application. I focused on "who" is doing it. TL8 enables ANYONE in your product team, not only developers, to change the texts in an Angular application themselves. The only requirement is that your Angular application uses ngx-translate ([https://github.com/ngx-translate/](https://github.com/ngx-translate/)).

I named it TL8. It's free. You can find a quick setup guide here: https://tl8.io

It takes the form of an application that anyone can download in your team. Once downloaded and open, you will see what looks like a standard web browser. And TL8 is, essentially, a web browser. Navigate to the application that you want to modify. If it's set up correctly, you will be able to modify translated text in your application. Once you are done with the changes, you can download the final results: the JSON translation files. You can hand those files over to your developers as is. Done.

With TL8, a few milestones have already been reached:

- ngx-translate's website has a link to tl8.io
- the first user feedback
- a performance issue and ... its fix
- 10 downloads

TL8 is a low hanging fruit. A juicy one. It will save hours of your precious team's time. You should try it.

* * *

KM

Photo by [Feliphe Schiarolli](https://unsplash.com/@flpschi?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) on [Unsplash](https://unsplash.com/s/photos/hanging-fruit?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText)
Introducing the Scott Makes Tech 2.0 Soft Launch
Published: 2021-04-01 15:34:58

I’m excited to begin the next phase in my career with this website and blog where I’ll share projects, insights, and stories from my rich history in web design and creative development.

[Visit Scott Makes Tech 2.0](https://scottmakes.tech/)

First of all, let me introduce myself. My name is Scott and I’ve been building websites for over 20 years. What I love about web development is being able to create something from nothing. Whenever I work with a team of creatives, designers, writers, and others, I find joy in brainstorming creative solutions and being able to bring them to life where nothing existed before.

I started Scott Makes Tech to serve as a place to share some of the work I’ve created, as well as share my experiences and insights through a blog. Today I am soft launching the 2nd version of this website. This version of the website includes a significant redesign of the 1.0 version, features a brand new way of showing my [portfolio](https://scottmakes.tech/portfolio), and adds the infrastructure for the Scott Makes Tech blog, which represents the next phase in my career and online presence. Look for a blog post in the future featuring more in-depth details.

I am preparing for a (hard?) launch of the site on May 1, which will include new pages and the beginning of a library of blog content, which I will host both here as well as syndicated to other common blogging platforms. But I simply couldn’t wait to share my new website, which is why I’ve decided to soft launch it today.

Please check back for more updates, or feel free to follow me on your preferred social media platform of choice for more updates. And because this is a soft launch, I’d love to hear your feedback. Please [contact](https://scottmakes.tech/portfolio) me with your feedback on this website, or let me know if there are any topics you’d like to see me write about soon.
Day 44
Tags: 100daysofcode, programming, javascript
Published: 2021-04-01 15:32:24

Day 44/100 of #100DaysOfCode

codewars | Node js

Hours coded: 2.3
Lines of code: 195
Keystrokes: 1932

via @software_hq's #vscode extension https://www.software.com/100-days-of-code
A nice website for the frontend developers
Tags: css, html, bootstrap, design
Published: 2021-04-01 15:31:35

Link : https://colorhunt.co/
1- What is Color Hunt?

Color Hunt is an open collection of color palettes, created by Gal Shir. Color Hunt started as a personal small project built to share trendy color combinations between a group of designer friends. The collection scaled up and now being used daily as a handy resources by thousands of people all over the world. Color Hunt was created with the goal of celebrating the beauty of colors, and to serve as a go-to resource for color inspiration.

2- Who is it for?

Color Hunt serves thousands of color schemes for many different design and art purposes. The color palettes are being used by graphic designers, artists, illustrators, web developers, fashion designers, marketeers, interior designers, and more. People use Color Hunt to get color inspiration and find the perfect palette for their projects. Anyone can save their favorite palettes, manage their personal collection, and have a quick access to copy the color codes.

3- Who creates the color palettes?

You, the users, are the ones who create the palettes using Color Hunt’s palette creator. The collection is open, and everyone can create and submit their own color combination. That’s how we keep Color Hunt diverse, colorful, social and inspiring. Each palette is a public property and not owned by a specific creator, nor by Color Hunt.
Minor and major project ideas for b.tech cse students.
Tags: beginners, project, advance, projectideas
Published: 2021-04-01 15:25:22

##This blog is written in order to discuss some minor and major project ideas for b.tech cse students.

###mostly students make their projects either in software development or AI (*machine learning*).

**Their are mainly two types of software.**
* System software.
* Application software.

**System softwares are consist of.**
1. Operating system.
 [operating system project ideas](https://sites.google.com/site/waheediqbalinfo/courses/OS-2013/os_projects)
2. Device drivers.
[device drivers project ideas](https://github.com/martinezjavier/ldd3)
3. firmware.
[firmware project ideas](https://www.electronicshub.org/embedded-systems-projects-ideas/)
4. utility software.
[utility software project ideas](https://www.upgrad.com/blog/python-projects-ideas-topics-beginners/)

**Application software development can be implement in four ways.**
1. CLI(command line interface)
[cli project ideas](https://realpython.com/intermediate-python-project-ideas/#command-line-project-ideas)
2. Desktop application with graphic user interface(GUI).
[gui project ideas](https://realpython.com/intermediate-python-project-ideas/#gui-project-ideas)
3. web application
[web application project ideas](https://www.crio.do/projects/category/web-development-projects/?utm_source=adwords&gclid=CjwKCAjwpKCDBhBPEiwAFgBzjxlUa-JLfG71kxINLR32DzmN05Go9SecxDjj77UPx-q9PMqXreHgwRoC1BkQAvD_BwE)
4. mobile application
[mobile application project ideas](https://www.intelegain.com/app-ideas-for-startups-to-launch-in-2021/)

**machine learning algorithms are categorised in to four types.**
1. Supervised learning. 
2. Un-supervised learning. 
3. Semi-supervised learning. 
4. Reinforcement learning.


[Machine learning project ideas](https://www.kdnuggets.com/2020/03/20-machine-learning-datasets-project-ideas.html)

**unorthodox project ideas.**
1. chrome extensions using javascript (*simple and cool*).
[chrome extension project ideas](https://www.freecodecamp.org/news/how-to-create-and-publish-a-chrome-extension-in-20-minutes-6dc8395d7153/)
2. your own framework like django in python, laravel in PHP.
  (*make a simple one later you can add more features.*)
[frameworl project ideas](https://www.salesforce.com/workdifferently/articles/how-to-design-framework/)
3. make your own markup language using XML.
[markup project ideas](http://www.inf.ed.ac.uk/teaching/courses/ec/handouts/xml.pdf)
4. Blockchain applications.
[blockchain project ideas](https://www.upgrad.com/blog/blockchain-project-ideas-for-beginners-students/)

**you can copy any project available on internet but the main motive here is to understand how it works and after that add your features so that you can explain what you have learn during this process.**

Any type of correction or suggestion will be appreciated.
**share your views in comment sections**.
ONE WEIRD TRICK JS DEVS aren't teaching you about
Tags: webdev, html, a11y
Published: 2021-04-01 15:20:00

Semantic HTML.

Accessibility starts with semantic HTML.

That's it. That's the trick.

Places to start learning:

- https://www.solidstart.info/
- https://a11y.coffee/
- https://dev.to/5t3ph/introduction-to-web-accessibility-5cmp
- https://www.a11yproject.com/
- [Deque YouTube](https://www.youtube.com/channel/UCvNQ5aJllZ5Oi49jtMKeb0Q)
- https://www.getstark.co/library/

> If you like videos and recognize the web is made of forms, check out my two-hour egghead video course: "[Accessible Cross-Browser CSS Form Styling](https://5t3ph.dev/a11y-forms)"