teleren/devto huggingface dataset:
Generating Typescript Interfaces Directly From The Database
Tags: typescript, webdev, angular, database
Published: 2019-12-12 10:31:54

---
title: Generating Typescript Interfaces Directly From The Database
published: true
date: 2019-12-12 00:00:00 UTC
tags: typescript,webdev,angular,database
canonical_url: https://www.leonelngande.com/generating-typescript-interfaces-directly-from-the-database/
---

The past couple of weeks I’ve been adding new functionality to an API and today began updating the Angular front-end application to reflect these changes.

Am just now realizing how much work I have writing interfaces, services, etc (makes one think more about automation). Luckily I found this library for auto generating typescript interfaces directly from the MySQL database, [Schemats](github.com/sweetiq/schemats).

Using Schemats, you can generate TypeScript interface definitions from (Postgres, MySQL) SQL database schema automatically.

To use it, you install the package globally with npm:

```
npm install -g schemats
```

Then inside the folder you’d like the generated files saved, run one of the following commands:

```
schemats generate -c postgres://database_username@localhost/database_name -t table_name -o output_file_name.ts

schemats generate -c mysql://database_username@localhost/database_name -t table_name -o output_file_name.ts
```

The above commands are to generate the typescript interface for a specific table. Given it’s not everyday I connect to a mysql database from the command line, I went through a couple tries before getting it to work, reason why I’ve used explicit names to describe the parameters the command takes.

To generate interfaces for all tables in the database, you run one of the following:

```
schemats generate -c postgres://database_username@localhost/database_name -o output_file_name.ts

schemats generate -c mysql://database_username@localhost/database_name -o output_file_name.ts
```

The output looks something like this:

```
/* tslint:disable */

/**
 * AUTO-GENERATED FILE @ 2019-12-12 10:28:45 - DO NOT EDIT!
 *
 * This file was automatically generated by schemats v.3.0.3
 *
 */

export namespace activitiesFields {
    export type id = number;
    export type user_id = number;
    export type subject_id = number;
    export type subject_type = string;
    export type type = string;
    export type created_at = Date | null;
    export type updated_at = Date | null;

}

export interface activities {
    id: activitiesFields.id;
    user_id: activitiesFields.user_id;
    subject_id: activitiesFields.subject_id;
    subject_type: activitiesFields.subject_type;
    type: activitiesFields.type;
    created_at: activitiesFields.created_at;
    updated_at: activitiesFields.updated_at;

}
```

There are more options and configurations you can checkout in the package’s [readme](https://github.com/sweetiq/schemats#readme). Happy coding!
how to file upload in laravel 6 ?
Published: 2019-12-19 13:37:51

---
title: how to file upload in laravel 6 ?
published: true
date: 2019-12-12 00:00:00 UTC
tags: 
canonical_url: 
---

Hi DevToday I will learn you how to store file with validation in laravel 6 I will add validation with image upload in laravel 6I will add image upload validation like image mimes max file upload etc So you can easily understand and you it simplyIn this blog made easy to upload the i
Laravel 6 Ajax Image Upload With Intervention Package
Published: 2019-12-16 13:39:48

---
title: Laravel 6 Ajax Image Upload With Intervention Package
published: true
date: 2019-12-12 00:00:00 UTC
tags: 
canonical_url: 
---

Hi DevToday I will learn you how to store file with Intervention Package in laravel 6 In This blog shows you how you can upload the image into the database and folder with examplewe upload the image into the folder and store into database using jquery ajax in laravel 6 applicationWe
The common misconception of @Injectable() in angular
Tags: angular
Published: 2019-12-11 23:42:00

---
title: The common misconception of @Injectable() in angular
published: true
description: What exactly does @Injectable() do?  It might not be what you think...
tags: #angular
cover_image: https://thepracticaldev.s3.amazonaws.com/i/wmeffl91lyblaicrvmhw.jpg
---

The official angular docs give the following description of *@Injectable()*...

https://angular.io/api/core/Injectable
*"Decorator that marks a class as available to be provided and injected as a dependency."*

I think that description isn't right.  Or at least it leads me to misinterpret the meaning.  Let me start by defining a concrete example...

Let's say we have AppComponent and UserService.  By default the angularCli will add *@Injectable()* to the service when it is generated.  

Now, to me, the official statement makes me think that *@Injectable()* on UserService allows us to add it in the constructor of AppComponent as a dependency.  "...marks a class as available to be provided and injected as a dependency".  But what happens if we remove the *@Injectable()* from the service?  Let me tell you - it still gets injected into AppComponent.  

Now lets add a second service, OrderService and add it as a dependency of UserService.  Now our application throws an error.  *"Can't resolve all parameters for UserService"*

When we add *@Injectable()* to the UserService it actually allows UserService to have dependencies injected into itself.  Not allow itself to be injected into AppComponent.

So we add *@Injectable()* to UserService since it needs to register with the dependency injected system to get a reference to OrderService.  We can even remove *@Injectable()* from OrderService since it doesn't have any dependencies.

I'm not saying you should remove *@Injectable()*.  In fact, you should leave it there even if your service doesn't have dependencies.  It does no harm.  I once had a service where the injected services weren't working and it took me ages to notice that *@Injectable()* was missing.  So don't do that.  

You might wonder why components are not marked with *@Injectable()* since they have dependencies injected into them.  Well, if memory serves, any decorator will have the effect of registering the class with the DI system.  So in this case @Component() is doing it.

Am I the only one who feels the description of *@Injectable()* isn't quite right?  Let me know.
Day24:Multi Thread - 100DayOfRust
Tags: rust
Published: 2019-12-11 23:30:33

In rust it is easy to spawn a thread, for example:

```rust
use std::thread;

fn main() {
    let t1 = thread::spawn(|| {
        println!("{}", "hello from t1");
    });
    // wait t1 to finish
    t1.join();
}
```

From my last article [Call Shell Command](https://dev.to/0xbf/day23-call-shell-command-100dayofrust-dma), say if we want to copy a file from source path to target path, we could do something like this:

```rust
use std::thread;
use std::process::Command;

fn main() {
    let t1 = thread::spawn(|| {
        let status = Command::new("cp")
                             .arg(&source_file_path)
                             .arg(&target_file_path)
                             .status()
                             .unwrap();
        println!("Status: {}", status);
    });
    t1.join();
}
```

And if we want to copy multiple files to target path in parallel, we can spawn multi threads.

However, say if we have 2000 files to copy, spawn 2000 threads simultaneously may not be a good idea, because unlike Go's lightweight go-routine, Rust's thread is the real thread in OS level. To create a huge amount of threads, it may consume too much resource. Plus, if in you thread you need to open file, in those 2000 threads means it may have 2000 files need to be open simultaneously, but there is a limit for opened file amount for one program.

Use `ulimit -n` to see it in your terminal, MacOS X will return 256, and Linux will return 1024. Although they are default value, we can change it to a bigger number, open too many files is not a good solution.

The real solution is, we can use a thread pool: in this pool we have a limited number of threads, and feed those threads with tasks.

How big the pool size is? Well, usually we will set it to be the number of [how many tasks can be run parallel](https://dev.to/0xbf/how-to-know-number-of-tasks-can-run-in-parallel-in-linux-and-macos-14pi), and in Rust we have a package `num_cpus` can help us to get this number.

In `Cargo.toml`:

```
[dependencies]
num_cpus = "1.11.1"
threadpool = "1.7.1"
```

In `main.rs`:

```rust
use threadpool::ThreadPool;
use num_cpus;

fn main() {
    // here we create a pool with size num_cpus::get()
    let pool = ThreadPool::new(num_cpus::get());
    
    for task in tasks.iter() {
        pool.execute(|| {
            // do some task here
        });
    }
    // wait for all tasks to be finished
    pool.join();
}
```
What tech & dev related podcasts should I listen to?
Tags: discuss, podcast, programming, productivity
Published: 2019-12-11 23:04:15

Lately I’m finding myself catching the train to work more often and as a result having extra time to zone out.

There is a distinct tech and dev shaped hole in my podcast library that I would really like to fill— so, what podcasts would you recommend?

I’m a full-stack lead developer in my day job so I’m open to any topics relating to tech or the industry!
Finding a Tech Job is a System, Not a Straight Line
Tags: career, beginners
Published: 2019-12-11 23:03:45

*I'm building a community over at [GetAJobIn.Tech](http://getajobin.tech) for self-taught developers & bootcamp students looking for their first job. This is the first email my students receive on my newsletter.*

One of the things that self-taught folks or bootcamp students struggle with is that constant struggle of wondering, "Can I really do this? Can I really switch to tech and get someone to pay me money to write code?" I've been there.

See if you can relate to this: you've been learning to code for several months (maybe years!). You're ready for that first job. You perfect your resume, upload it everywhere you can think of, apply to a bunch of jobs, and wait. Only to hear...crickets. And then come the rejection letters. "Why are they rejecting me from a junior developer job for not having experience!? That makes zero sense!" Ugh. It's so discouraging!

You're not alone. You see, junior developers are stuck with The Experience Paradox: a lot of jobs require experience, but how do you get experience without a job? It turns out there's a way to crack this, and I'm going to teach you that as best as I can over these emails and blog articles.

The thing to remember about finding a job in tech, whether it's your first one or just a better one, is that it's a system, not a straight line. Getting your first job isn't a linear process like this:

1. Learn to code somewhere (freeCodeCamp, bootcamps, wherever)
2. Apply to a zillion jobs.
3. Get awesome job.
4. Live happily ever after.

It's more like washing your hair: lather, rinse, repeat. There are a handful of things you can be doing repeatedly over time to build up your skills, your network, and your personal portfolio to make you more and more attractive as a candidate. You see, learning to code is only one part of the process (I call it **sharpening your skills**). So is applying to jobs (I call this **taking more swings**). The problem is that not many people talk about all the other things you need to do to land that first job. That's why you're here!

As we get to know each other, I'll be sending you more resources on each of these parts of the system. In the meantime, though, I want you to know that the answer to the question "Can I really do this?" is a resounding YES! You totally have what it takes. If you enjoy programming, that means you're cut out to be a programmer. Plain and simple. Doesn't matter who you are, where you live, or what you look like. That's what's so amazing about programming!

Next time, I'll teach you the second piece of this system.

*If you're curious about the rest of this series, head over to [GetAJobIn.Tech](http://getajobin.tech) and sign up for the newsletter. I'll send you a series on the 3 Surprising Keys of Getting a Job in Tech to get you started, as well as the continuation of the series above (and no spam, ever). Feel free to write me back and tell me how you're doing and what you're working on. You got this! 💪*
Which steps to ensure the robustness of a small distributed system ?
Tags: help, distributedsystems, discuss
Published: 2019-12-11 22:59:00

I'm a student doing a college project. Can say I'm an experienced programmer, I have been tackling with distributed systems for so long before this project but never taken it seriously.

This project is fairly small as a distributed system, so it's easy to make a working implementation. Now I have to make it robust and write a report about it.

Searching on the web is frustrating. There're only long reads in form of books, smaller one like reports or paper focus on only one specific aspect such as scalibility. They are all for domain experts working on large systems in industry. The 8 fallacies of DS do remind me something to do but they're still abstract concepts, mot HOWTO.

So, how to make a distributed system robust (practically secure and fast), and, prove it (any metrics I can measure and put on the scientific report) ?

Many thanks !
Codecademy - CSS 4: Changing Box Model
Tags: 100daysofcode, codenewbie, womenintech, css
Published: 2019-12-11 22:49:21

###**What i've learnt from the Changing the box model lesson of Codecademy's CSS course.**
- It can be tricky using the box model because there are many different measurements to contend with. You have to add the content + padding + borders etc.

- The previous box model looks like this:

![Original box model](https://thepracticaldev.s3.amazonaws.com/i/huqemln0kci0sjdssfdo.png)

- You can reset the entire box model in your CSS with this:
```
* {
  box-sizing: border-box;
}
```
- The code above resets the box model to border-box for all HTML elements. This new box model avoids the dimensional issues that exist in the former box model.
- In this box model, the height and width of the box will remain fixed. The border thickness and padding will be included inside of the box, which means the overall dimensions of the box do not change.
- This is good because if you change the border width or the padding, the size of the box doesn't change because they're included within it.

- This is the layout of the new box model.
![Border-box box model](https://thepracticaldev.s3.amazonaws.com/i/3u9ewya3eghq0fk6hhff.png)
Which react form library is better?
Tags: discuss
Published: 2019-12-11 22:37:30

Which react form library is better?
- react-final-form
- final-form 
- react-hook-form 
- redux-form 
- formik 

*check* - [npmtrends](https://www.npmtrends.com/react-final-form-vs-final-form-vs-react-hook-form-vs-redux-form-vs-formik)
Next-translate released 🎉
Tags: nextjs, javascript, react, i18n
Published: 2019-12-11 21:52:25

---
title: Next-translate released 🎉
published: true
description: i18n for Next.js static pages
canonical_url: https://aralroca.com/blog/next-translate-released
tags: nextjs, javascript, reactjs, i18n
---

After having some trouble with `next-i18next` library to internationalize pages, we decided to create an alternative library! With some differences: 

📦 Tiny (~1kb)
⚡️ It also works for static-sites (with no server)

We just released it today 🎉

The result after replacing `next-i18next` to `next-translate` in our project (with a custom server):


Before:

![Before](https://thepracticaldev.s3.amazonaws.com/i/h8oi7pr43ibm06wd6lf5.jpeg)


After:


![After](https://thepracticaldev.s3.amazonaws.com/i/ti0et3hv1ym9d4mcxqyg.jpeg)


714 B !! 🤯



Please, help us with a star on GitHub repo (or contribute, PRs are welcome):


👉 https://github.com/vinissimus/next-translate
Kotlin Native Experiment
Tags: kotlin, llvm
Published: 2019-12-11 21:33:23

---
title: Kotlin Native Experiment
published: true
description: A simple kotlin native hello world from scratch
tags: kotlin, llvm
---

I don't know why but I really love simple executable programs. Maybe it's just because I am dealing with Java stuff and missing fast and small applications. Executables without any runtime dependencies. That's why Go and Rust languages blink. No offense but I don't like Go's exception handling and Rust syntax is pretty weird. More human-readable languages like TypeScript and Kotlin seems better. Thanks to LLVM and GraalVM, our programming languages and applications are faster than ever.

Microservices age triggers the micro-sized and ultrafast applications and frameworks. Micronaut, Quarkus, Helidon, and Spark some of the great examples of that era. Thanks God, all those fancy toys and spring boot supports Kotlin.

Kotlin is one of my favorite programming languages. To be honest, at the beginning I refused to accept the variable definition syntax.


```kotlin
val myVariable: String = "hello"
```

I find classical Java-style more convenient. For instance when you write `CarFactory` IDE auto-completes `carFactory` variable name in Java-like programming languages.

```java
CarFactory carFactory = new CarFactory();
```

But despite its unusual variable declaration, there're plenty of cool things in Kotlin. Immutable data types, data classes, by default final classes, co-routines, and many more. I am determined and focused on the journey of Kotlin. So here we're. Gonna try a Kotlin native application.


Currently, most of the Kotlin native examples are based on IntelliJ IDEA. Well... I didn't like this idea. It should be as simple as possible. So I tried to download a native compiler. But currently, it's really difficult to obtain one. Either you should compile or you should use IntelliJ IDEA.

So I found out the executables URL. You can download them for 1.3.61 version.

- [Linux](https://download.jetbrains.com/kotlin/native/builds/releases/1.3.61/linux/kotlin-native-linux-1.3.61.tar.gz)
- [Windows](https://download.jetbrains.com/kotlin/native/builds/releases/1.3.61/windows/kotlin-native-windows-1.3.61.zip)
- [MacOS](https://download.jetbrains.com/kotlin/native/builds/releases/1.3.61/macos/kotlin-native-macos-1.3.61.tar.gz)

After downloading and extracting the content you can compile via command-line. Try to save this hello world program as `hello.kt`


```kotlin
fun hello(): String = "Hello, Kotlin/Native!"

fun main() {
    println(hello().toLowerCase())
}
```

and then let's compile it.

 
```bash

./kotlinc -o hello hello.kt
```

Kotlin compiler is gonna compile needed dependencies. After compilation completed we can try our executable.

```bash
./hello.kexe
```

It's 387KB a little bit bigger than a standard C/C++ application. But it's Ok. :) It's not a statically compiled executable. The target is dynamically linked.
Weekend Challenge - Chitter
Tags: makers, ruby, sinatra, postgres
Published: 2019-12-11 21:30:08

Another week means another weekend challenge. This week was *Chitter* which was a clone of Twitter. This was definitely the most difficult challenge so far, it incorporated everything we learned with the added difficulty of *SQL* databases. It was quite rewarding to get most of it done. 

The main problem I didn't get through was setting up the sign in and log out. But I managed to get everything else done, including adding timestamps to the statuses and setting up a signup form as well as saving the information in the form to the database. So a lot better than last week but I definitely need more practice.

Although seeing my pair partners code helped clear a few things up for me. I was able to see what I could’ve done better and they were able to talk me through it. This challenge was very difficult overall and I can't wait to give it another shot over Christmas.
Qt for WebAssembly
Tags: discuss, webdev, webassembly, qt
Published: 2019-12-11 21:11:33

As of [Qt 5.13](https://doc.qt.io/qt-5/index.html), [WebAssembly](https://webassembly.org/) is a [supported target](https://doc.qt.io/qt-5/wasm.html).

[Qt](https://www.qt.io/) is a cross-platform toolkit for building GUI applications.  It is the toolkit used in the [KDE](https://kde.org/) set of Linux desktop tools, as well as the basis for widely used commercial and FOSS applications such as [Photoshop Elements](https://www.adobe.com/products/photoshop-elements.html), [Mathematica](https://www.wolfram.com/mathematica/), [VLC](https://www.videolan.org/vlc/), and [VirtualBox](https://www.virtualbox.org/) - and [many more](https://en.wikipedia.org/wiki/Qt_%28software%29#Applications_using_Qt).

This release means you can distribute Qt apps as if they were web applications, and users execute them install-free entirely within in a web browser (or other WASM environment), at near-native performance - almost as if it had been installed locally.

Has anyone tried this out yet?  How did it go?  Will any of you be eschewing [React Native](https://facebook.github.io/react-native/) or [Flutter](https://flutter.dev/) for this, or porting a desktop application?  Why or why not?

*cover image: [kde mascots](https://community.kde.org/Promo/Material/Mascots)*
Cómo usar AWS Cli en AWX
Tags: aws, ansible, awx
Published: 2019-12-11 21:05:56

Existen ciertos momentos donde queremos usar una función de AWS y no está disponible como módulo en Ansible, en esos casos solemos usar `command`, pero al momento de integrarlo en AWX, nos saldrá un error de:  `You must specify a region. You can also configure your region by running \"aws configure\"."`
Para solucionarlo, utilizaremos `environment`, esto solo funcionará para la tarea en específico, no para el playbook en conjunto.

````---
---
- name: Ejecutar comando
  command:  aws ec2 describe-instance-status --instance-id "{{ instance_id }}"
  environment:
    AWS_DEFAULT_REGION: "{{ region }}"
    AWS_ACCESS_KEY_ID: "{{ aws_access_key  }}"
    AWS_SECRET_ACCESS_KEY: "{{ aws_secret_key }}"
```

Con esto ya debería funcionar sin problemas.
Is it safe to ship JavaScript Source maps to production?
Tags: javascript, discuss, css
Published: 2019-12-11 20:56:32

Source maps are basically files generated while building for production that can help revert a combined/minified file back to an original state. 

Most JavaScript and CSS sources are usually minified and source maps serve as a memory map to the compressed files. It's generally a good practice to minify and combine your assets (Javascript & CSS) when deploying to production. This process reduces the size of your assets and dramatically improves your website's load time.

When you minify and compress your JavaScript or CSS files, the output files are usually minified, unreadable and totally different from the original source created by a developer. This is actually one of the easiest ways to increase your website performance.

When you build your application for production, source maps are usually generated alongside your built files which are minified already. They hold the original sources of your code and helps in debugging your code live.

With source maps, you can click on a certain line and column number in your generated JavaScript, and that will do a lookup in the source map which will return the original location. Most developer tools can now parse the source map automatically and look as if you're running the unminified and uncombined files.

However, is it safe to leave that in production because, with the source map, you can generate the real source code and able to read the unminified code?

I am not a security guy or so, I am just curious if there could be a way that could make your site insecure. Unless you have your secret/api keys hard corded or something similar.

So is it safe to ship source maps to production?