teleren/devto huggingface dataset:
Defining a CSS Grid
Published: 2023-01-07 08:47:11


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wd25qk0z1t0bcyi16czr.jpg)Here is the code for a simple example of a **css grid**:
First, the **HTML** file
`<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="stylesheet" href="defining-a-grid.css" />
    <title>Document</title>
  </head>
  <body>
    <div class="grid">
      <div>Cell 1</div>
      <div>Cell 2</div>
      <div>Cell 3</div>
      <div>Cell 4</div>
      <div>Cell 5</div>
      <div>Cell 6</div>
      <div>Cell 7</div>
      <div>Cell 8</div>
      <div>Cell 9</div>
    </div>
  </body>
</html>`
Then, the **CSS** file:
`* {
  box-sizing: border-box;
}
.grid {
  display: grid;
  grid-template-columns: 200px 200px 200px;
  grid-template-rows: 200px 150px;
  grid-auto-rows: 100px;
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  /*  or grid-gap 20px instead of lines 9 and 10*/
}
.grid div {
  border: 1px solid rgb(0, 95, 107);
  border-radius: 3px;
  background-color: rgb(218, 230, 231);
  padding: 0.2em;
  color: rgb(212, 27, 42);
  font-size: 120%;
}`
Now, let’s take all the css lines reffering to the css grid and detail what they do:
•	**box-sizing: border-box** is the default styling that browsers use for the `<table>`, `<select>`, and `<button>` elements, and for `<input>` elements whose type is radio, checkbox, reset, button, submit, color, or search.
**border-box** tells the browser to account for any border and padding in the values you specify for an element's width and height. If you set an element's width to 100 pixels, that 100 pixels will include any border or padding you added, and the content box will shrink to absorb that extra width. This typically makes it much easier to size elements. 
•	**display: grid** - The grid CSS property is a shorthand property that sets all of the explicit and implicit grid properties in a single declaration. Using **grid** you specify one axis using **grid-template-rows** or **grid-template-columns**, you then specify how content should auto-repeat in the other axis using the implicit grid properties: **grid-auto-rows**, **grid-auto-columns**, and **grid-auto-flow**.
•	**grid-template-columns: 200px 200px 200px** – we set 3 columns of 200px width each.
•	**grid-template-rows: 200px 150px** – we set 2 rows: the first one of 200px height and the second one of 150px height;
•	**grid-auto-rows 100px** – the remaining content is diplayed on rows of 100px height each;
•	**grid-column-gap: 20px** – we set a 20px gap between columns;
•	**grid-row-gap: 20px** – we set a 20px gap between rows;
•	**grid-gap: 20px** – we can use this instead of grid-column-gap: 20px and grid-row-gap: 20px to set the gap between columns and rows to 20px.
Cheapest CUDA-Compatible Cloud GPU Options in 2023
Tags: cuda, cloud, deeplearning, nvidia
Published: 2023-01-31 21:05:24

So you need to train some big deep learning models, but your RTX card isn't quite up to the task?

This is because you're trying to fine-tune [FlanT5 XXL](https://huggingface.co/google/flan-t5-xxl), which requires a lot of GPU power.

You're on a budget? No problem. Your best option is probably [Lambdalabs](https://lambdalabs.com/), which offers access to a cloud instance with an A100 GPU and 40 GB VRAM for $1.10 per hour.

Is there a cheaper option? Yes, there is. You could use [Google Colab](https://colab.research.google.com/), which offers a 16GB T4 GPU for free, but with the drawback of having to periodically respond to human verifications.

If you prefer to access the GPU through SSH, this option may not be practical for you.

Another option that you may find interesting is spot instances. They're often cheaper than traditional instances, but come with a catch - they can be hibernated at any time without warning, which can be disruptive. However, your data won't be lost, so you can continue the training process from where you left off.

I recently tried spot instances at [Datacrunch](https://datacrunch.io/), and I was able to run an instance for 8 hours without any interruptions. Note that the spot instance option may not be listed on their pricing page as it's still in beta, and its stability may be limited.

For an A100 with 40GB VRAM, you'll pay $0.45/hour, and storage will cost an additional $0.15/hour for 550 GB. This brings the total to $0.60/hour.

Datacrunch is not the only provider of spot instances. Other options include [Jarvislabs](https://cloud.jarvislabs.ai) and [Runpod](https://www.runpod.io/gpu-instance/pricing), among others.

In conclusion, if you're on a budget but need some serious GPU power for deep learning training, the cloud has got you covered. Whether it's Lambdalabs, Google Colab, or the daring option of spot instances, you'll find an option that fits your needs and budget. Just remember, your work can get interrupted at any time if you go with spot instances. But hey, that's the price you pay for a good deal. So get your FlanT5 models ready for fine tuning!
First Look Into CodingDojo
Tags: bootcamp, webdev, discord, beginners
Published: 2023-01-31 21:04:16

## "Land Your Dream Job in Tech"

That's what the opening line is on their [website](https://www.codingdojo.com/). "Learn today's most in-demand digital skills and kickstart your new career".

![why codingdojo](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tbjzx1cscpt4wys43qv2.png)

## Bootcamp Courses

### Software Development
#### Online Full-Time
16 weeks | Monday - Friday | 70 - 90 hours a week

#### Online Part-Time Accelerated
18 - 34 weeks | 25 - 30 hours a week

#### Online Part-Time Flex
30 weeks | 10-15 hours a week

### Data Science
#### Online Part-Time
16-20 weeks | 25 hours a week

### Cybersecurity
24 weeks | 25 hours a week

## Admissions
Scheduling a Q&A phone call with a admissions assistant is done online quickly and easily. The same thing as the interview process, which is basically the same as the Q&A phone call. They take you through what to expect, financial aid, scholarships, career services, and any other questions you have. You also go through submitting your deposit to reserve your seat in the class (which can be waived for certain financing options), that comes up to be around $545.

![open house](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/251qwh45632oby4oy621.png)

When you go over the scholarships, they'll basically guarantee that you'd get $1,000 off the tuition as long as you submit the 300 word application, plus if you go to an open house there's a $100 off code at the end.

![applications for scholarship ](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mrzfxacyrj8kp37ps4wl.png)

## Career Services
The career services start day 1 - helping you with networking, resume writing, your LinkedIn, etc. Later on, they help you with interview questions, contract/salary negotiations, and the more complex stuff around getting a job.

![alumni work](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/iq146rr5ks7s8rons5g9.png)

![featured press](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3wdfvzukonwtryl4vu71.png)

## Sounds great right?
Of course do your own research if doing a bootcamp is what you are interested in pursing. There are many bootcamps out there. For example, eCornell! I'll do an article on that one later and keep you updated on CodingDojo.

Happy coding!
Latin x Python: 31/01/23
Tags: webdev, programming, python, latin
Published: 2023-01-31 20:59:24

It's been more than a week since I started Latin is Fun, a website whose ultimate aim is to help children around the world learn Latin in a fun way.
My aim for now though is to create a website which can easily generate questions like English-Latin, Latin-English or grammar questions (eg. what case a word is in).
I've added some major updates to the website since then!

---

Features I have added since the 28th of January (Saturday):
- Added pages for verbs and nouns, where it shows the tables of a word (for noun that is singular and plural, and for verbs that it tenses)
- Updated the CSS a little bit so the website looks a bit more cleaner
- Made the CSS responsive
- Added a navigation bar which shows up on every page of the website
- Hosted the website on Replit, so now anyone can test it out

---

To test out the website yourself, visit https://latin-is-fun.vulcanwm.repl.co
Comment below if you have any feedback or feature requests.

---

Demos:
Main Page:
![main page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/30wkofvsqexxw7tdlf8p.png)

Verb Page (amo): 
![verb page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pi2w99v3dmesibp1hb0i.png)

Noun Page (annus):
![noun page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8v1rk175vp3j7a5ydwsa.png)

Convert Noun Page:
![convert noun page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xz8bmm4ini8iqnvkkqc7.png)

---

Thanks for reading.
If you want to support me with this project, make sure to follow me and like this post!
Comment below if you have any feedback or feature requests.
Blogbeat is now connected to Medium
Tags: blogbeat
Published: 2023-01-31 20:25:38

#### Blogbeat is now connected to Medium. You are able to share your articles from Blogbeat on Medium with just one click.Find out more about Blogbeat and the Medium API in the following article.



Introduction
============

* Blogbeat uses the official medium.com api.
* Share articles on your personal or company profile.
* We will never post to medium.com without your permission.
* A Blogbeat account is required.

 

1. Request Access
=================

* Users can request an access token by emailing [yourfriends@medium.com](mailto:yourfriends@medium.com)
* medium.com will then grant access on the [Settings page](https://medium.com/me/settings) of your Medium account.

 

2. Generate Key
===============

* In the "Settings" >> "Integration tokens" section
* create a new token by adding a description and
* clicking on "Get integration token".

 

3. Add Key to Blogbeat
======================

* Open an unpublished article and search for the medium.com logo and a "Set Up" button next to it.
* Click the "Set Up" button and add the key from step 2 to the "Integration Token" field.
* Click on "Save Changes" to complete the Setup.

 

More Information
================

More Information regarding the medium.com api: <https://github.com/Medium/medium-api-docs>

Find the original article here: <a href="http://blogbeat.app/blog/maxonce/article/set-up-mediumcom-api-with-blogbeat">http://blogbeat.app/blog/maxonce/article/set-up-mediumcom-api-with-blogbeat
Weekly Quick Tips: AWS Lambda Deployments
Tags: aws, devops, beginners
Published: 2023-01-31 18:28:31

Hello folks! Been real deep in AWS as I learn more about the services and today's tip comes straight from the AWS team that I have been working with! If you don't want to read the rest, here's the quick TL;DR:

There's a known issue (as of 01/01/2023 is when we started dealing with it) with AWS Lambdas where **even if the size is over the limit, _sometimes_** it can still be deployed to your environments. The best way to ensure you never experience any issues is to be sure that you are under the size limit:

250 MB for uncompressed data (including layers)<sup>[1](#sources)</sup>
50 MB for compressed data (including layers)

---

Now here's an overview of some notes and tips that I learned from my investigation! First off, it doesn't matter if this is done via CloudFormation, CodePipeline or any of their services, it all eventually has to go through Lambdas and that is when you will hit your size issue. The error message will appear as something like so:

> Code uncompressed size is greater than max allowed size of 272629760. (Service: Lambda, Status Code: 400, Request ID: 99a3c30a-b444-4558-ba5f-13ce38922f5b)" (RequestToken: dc727a33-6f29-e240-1452-97c228fe2ad0, HandlerErrorCode: InvalidRequest)

The error message is pretty solid in that it immediately tells you that your code is larger than what they allow. However, welcome to the first obstacle that I encountered - depending on the OS and even how you unzip (GUI vs terminal), there's a slight size difference. Going with the terminal will show you the smallest size (command for that is `du -h` which stands for disk usage) while the GUI can be larger. The difference is negligible but something to note if you are wondering why there is a size difference.

Now comes to the biggest revelation (besides the known issue) that helped me solve my issue: AWS Lambda runtime environments have their own `aws-sdk` so you do not need to include that in your packages. Let me repeat that: **You do not need to include `aws-sdk` in your packages.**

For us, that immediately removed 80 MB and helped us well be under the limit. And then it took another couple weeks continuously talking to AWS support to determine that it is a known issue why even though we were over the size limit, we were still able to deploy sometimes. 

<a name=sources></a>Sources:

<sup>1</sup>https://docs.aws.amazon.com/lambda/latest/dg/gettingstarted-limits.html
How to add upload images in Django?
Tags: webdev, django, python
Published: 2023-01-31 20:16:23

**Steps to upload images**
1. First go to settings and add this under static_url
```python
MEDIA_URL = 'media/' # MEDIA_URL tells Django where to look for uploaded files when in development mode (DEBUG = True)
MEDIA_ROOT = BASE_DIR / 'media' # MEDIA_ROOT tells Django where to store uploaded files when in development mode (DEBUG = True) 
```
2. In your root project url, add these lines
```python 
from django.conf import settings
from django.conf.urls.static import static
from django.contrib import admin
from django.urls import path, include
from core.views import frontpage, about
urlpatterns = [
    path('about/', about , name="about"),
    path('admin/', admin.site.urls),
    path('', include('store.urls')),
    path('',frontpage,name="frontpage"), 

]+ static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

```
Now, if you want to access the image url, do this
```HTML
<img src="{{ product.image.url }} alt="image"
```
Shorten Git Commands
Tags: git, productivity
Published: 2023-01-31 20:00:46

If you type the following commands, you are wasting a lot of ‘seconds’ during your day:

`git checkout
git branch
git commit
git status`

Just go to a terminal or command prompt on your computer and type the following commands

`git config --global alias.co checkout
git config --global alias.br branch
git config --global alias.ci commit
git config --global alias.st status`
 

Now, you can see run the commands

`git co
git br
git ci
git st`

and so on...
This may look like minimal time saving, but this can save you tons of time and typing in the long term.

_(Since these aliases are being written to your global .gitconfig file, these commands are available from each and every repo on your system.)_
Spring Dependency Injection, IoC and Autowiring
Tags: spring, java, dependencyinjection, autowiring
Published: 2023-01-31 19:43:03

## **What's Dependency Injection (DI)?**
<u>Dependency Injection (DI) is a design pattern</u> that implements the principles of Inversion of Control (IoC) by providing an object with its required dependencies from an external source instead of having the object create or locate them on its own. This not only improves code maintainability, flexibility, and testability, but also follows the IoC concept of shifting control from the object to the external dependencies, thereby decoupling the object from its dependencies and promoting modularity

## What is IoC?##
<u>Inversion of control (IoC) is a general concept</u> that refers to a program or system where the control flow of a program is determined by a framework or container, rather than by the program itself. In Spring, IoC is achieved through dependency injection.

In Spring, there is an implementation known as the <b>IoC container</b>, which connects the dependencies, locates, and manages the life cycle of beans. The Spring IoC container is represented by <b>ApplicationContext</b>, which is responsible for creating, setting up, and putting together the beans mentioned. The container follows the instructions for which objects to create, configure, and assemble from the configuration metadata it reads.

## What is Autowiring?##
In the context of Spring, <u>Autowiring can be used to implement Dependency Injection</u>. When you enable Autowiring for a bean, the Spring framework will automatically resolve and wire the dependencies for that bean, using one of the DI techniques, such as Constructor-based, Setter-based, or Field-based Dependency Injection.

In other words, Autowiring is a way to simplify the process of implementing Dependency Injection in Spring. By using Autowiring, you can eliminate the need to explicitly specify the relationships between beans in the configuration file, allowing you to make changes to your code more easily.

In this example, we will use the **@Autowired** annotation to enable Autowiring in Spring.

## The 3 types of Dependency Injection in Spring are:
- **Constructor-based** Dependency Injection: The dependencies are provided to an object via constructors.

```
public class MyService {
   private MyDependency myDependency;

   // constructor injection
   @Autowired
   public MyService(MyDependency myDependency) {
      this.myDependency = myDependency;
   }
}
```

- **Setter-based** Dependency Injection: The dependencies are provided to an object via setter methods.

```
public class MyService {
   private MyDependency myDependency;

   @Autowired
   public void setMyDependency(MyDependency myDependency) {
      this.myDependency = myDependency;
   }
}
```

- **Field-based** Dependency Injection: The dependencies are provided to an object via fields.

```
public class MyService {
   @Autowired
   private MyDependency myDependency;
}
```
Devart Introduces dbForge Studio for PostgreSQL 3.0 With a Powerful Pro Edition and Support for Linux and macOS
Tags: postgres, dbforgestudio, devart, dbforge
Published: 2023-01-31 19:36:43

---
title: Devart Introduces dbForge Studio for PostgreSQL 3.0 With a Powerful Pro Edition and Support for Linux and macOS 
published: true
description: Devart has released a new version of dbForge Studio for PostgreSQL - 3.0. This release brings an advanced Pro Edition and availability on Linux and macOS. 
tags: #postgresql #postgres #dbforgestudio #devart #dbforge
# cover_image: https://direct_url_to_image.jpg
# Use a ratio of 100:42 for best results.
# published_at: 2023-01-31 17:53 +0000
---
Devart, the leading provider of database software, connectivity solutions, and developer tools, has released a new version of [dbForge Studio for PostgreSQL](?utm_source=dev.to&utm_medium=referral&utm_campaign=pr_postgresql_31.01.2023), an IDE for PostgreSQL development, management, and administration. 

The update includes the following enhancements: 

- dbForge Studio for PostgreSQL is now available on Linux and macOS via CodeWeavers CrossOver. 

- The Pro Edition functionality has been extended with Data Compare, Schema Compare, and Data Generator. It is also now possible to export SQL Query History to the CSV format. Command-line support has been added for the following features: Data Compare, Schema Compare, Data Generator, Execute Large Scripts, Data Export, and Data Import. 

- Significant improvements have been introduced to Text Editor. These include: support for the SELECT INTO statement, non-aggregated column name hints in GROUP BY clauses, quick navigation between brackets, query profiling for Amazon Redshift databases, and more. 

- Finally, the connectivity options have been extended, including support for the latest version of PostgreSQL (version 15) and compatibility with AWS Babelfish. Support for high-DPI devices has also been implemented. 


To learn more about the release, please visit https://blog.devart.com/meet-dbforge-studio-for-postgresql-v3-0.html 


About Devart 

Devart is a multi-product company that develops advanced tools for database development and administration, ALM solutions, data providers for database servers, as well as data integration and backup solutions. 

 
For additional information about Devart, visit https://www.devart.com/.
What is JSON ?
Tags: javascript, react, programming, webdev
Published: 2023-01-31 19:33:20

The full name of JSON is JavaScript Object Notation.JSON is a lightweight format for storing and transporting data and it is text-based so it can be easily read by human. JSON became a data Exchange standard on web.
JSON data represented in the form of key and value pair and curly braces {} holds data as object.

```
'{"name":"John", "age":30, "city":Delhi}'
```
In above code name,age and city are the keys and John,30 and delhi are the values of that keys.

```
let personName = obj.name;
let personCity = obj.city;
```
Using above code we can access JSON data.

**Datatype of Values-**
In JSON, values must be one of the following  types:
- string
- number
- object
- array
- boolean
- null

*Note :- JSON Syntax is subset of Javascript.

In the past we use XML for data Exchange but now JSON uses increase tremendously specialy in Javascript.

Another exam of **JSON** file

```
{"employees":[
  { "firstName":"John", "lastName":"Doe" },
  { "firstName":"Anna", "lastName":"Smith" },
  { "firstName":"Peter", "lastName":"Jones" }
]}
```
Above JSON code employees is key and it's value is in the form of array and here are 3 element of array and each element is again an object and hold keys and value.

**XML** file for same data looks like-

```
<employees>
  <employee>
    <firstName>John</firstName> <lastName>Doe</lastName>
  </employee>
  <employee>
    <firstName>Anna</firstName> <lastName>Smith</lastName>
  </employee>
  <employee>
    <firstName>Peter</firstName> <lastName>Jones</lastName>
  </employee>
</employees>
```
**We use XML because, XML is much more difficult to parse than JSON and JSON is parsed into a ready-to-use JavaScript object easily.**

Thank You...
What time to workout as a programmer?
Tags: programming, productivity, tutorial
Published: 2023-01-31 19:26:58

Programming is a good way to stretch the synapses between your brain cells but usually comes with a price to pay. As everything in life is Ying-Yang and requires some balance.

We, humans, are made for work. By work, I mean physical work. If you go a couple of thousands of years into the past you would see that men would fight for food and territory and women would collect berries as well. In other words "You have to deserve your food on the table". Those days are way behind us, but our bodies aren't.

If you exercise on the daily basis, let's say 15 minutes of stretching or some calisthenics you will achieve a tremendous amount of motivation for other stuff in life. A cure for laziness would be a daily workout. Treat it as a daily stand-up meeting with your team. 
Slap that favorite podcast, do some exercises, and thank me later. 

Often decision-fatigue kick in after your busy working hours and you depleted your if-else blocks in your brain. Usually, those logical blocks would re-fill after a good sleep. 

If you are not familiar with decision fatigue you can read more [here](https://en.wikipedia.org/wiki/Decision_fatigue).

Technical details: 
- 15 minutes are less than 2% of your day.
- better mood
- good drive to start the day
- keeping your heart happy

What type of workouts are good: 
- running (yes, try run 15 minutes with regular pace)
- stretching / yoga
- HIIT(high interval intensity training)
- Tabata
- Jump rope
- Calisthenics circuit training

Anyway, I suggest that kind of workout be done either fasted as first thing in the morning or first thing after your breakfast. That way you can kickstart your day, get that adrenaline + dopamine booster and you'll be ready to battle the day. Otherwise, decision fatigue will take over especially after long working day.


Peace