teleren/devto huggingface dataset:
MOD-CSS Breakpoints - examples & tutorial
Tags: webdev, beginners, tutorial, modcss
Published: 2023-01-11 12:13:24

The importance of media queries to define breakpoints is no longer to be demonstrated in the creation of responsive/adaptative UI. 
If most CSS frameworks are limited in this, this is not the case MOD-CSS which fit good with any CSS property; The combinations are endless.

In this series of tutorials, you can take advantage of it in creating your user interfaces.


## Using CSS Media Queries for Responsive Apps

> MOD-CSS encourages mobile-first design, so display on mobile is what you need to think first, and then plan for display on larger screens.


## Basic example - One row, two responsive columns
 

> In this basic example, each column in the flexgrid hold on a row when you're on mobile. 
> On larger screen (md? = 768px and above), the column's width i
ncreases to 50%. This will make them both fit on one row.


![mod-css row column with breakpoint](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ut4g5mt3rfocio3iy5bk.png)

![mod-css anime breakpoint](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fq4etcgtmzaejor5sar9.gif)


## Second example - one columns take 70% of row's width with gap

> In this example, on lg breakpoint (lg? = 992px and above) second column takes 70% of width and the first column resized to 30%.
> The row set gap of 2% between them

![mod-css row column with breakpoint and gap](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qdtemqgxfwxn5rfd7fpt.png)

![mod-css anime breakpoint with gap](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/91p2c965yexsr1t4ehjz.gif)


**MOD-CSS**
MOD-CSS is a lightweight CSS framework that allows you to quickly create flexible UI without using to traditional way of CSS. 
It can be used in conjunction with Bootstrap, Bulma .. Tailwind without hindering their use.


[Documentation breakpoint](https://www.mod-css.com/docs/breakpoints/)
[Github](https://github.com/modsLabs/mod-css/)
MySQL ORDER BY Clause: Syntax and 13 Examples
Published: 2023-01-11 11:36:56

---
title: MySQL ORDER BY Clause: Syntax and 13 Examples
published: true
description: MySQL Order By Tutorial
tags: 
# cover_image: https://direct_url_to_image.jpg
# Use a ratio of 100:42 for best results.
# published_at: 2023-01-11 11:33 +0000
---
Let's read about the MySQL ORDER BY entity, syntax, and usage scenarios and take a closer look at their specific examples - https://blog.devart.com/mysql-order-by-tutorial-html.html

![MySQL Order By](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x5w06gffl565qvyqobjw.jpg)
My 1st post title
Published: 2023-01-11 11:36:49

My 1st post content.

Hi, I’ve recently Joined the open source course of Gabor Szabo in order to strengthen my GIT and programming skills, in addition to exploring new ideas, people and new technologies.
I’m really looking forward to whatever the course has to offer me 😊

In our first lesson I’ve been messing around with Git environment, exploring its basic features. For example here’s the Url of my first pull request:
[first pull requests](https://github.com/Code-Maven/osdc-2023-01-public/pull/38#issue-1533216479)

My Day job is as an automation developer for a Global projects company (Based in UK).
Building Production-Ready Docker Images With Multi-Stage Builds
Tags: learndocker, learncontainerizatio, dockertutorial, docker
Published: 2023-04-04 23:31:39

---
title: Building Production-Ready Docker Images With Multi-Stage Builds
published: true
date: 2023-01-11 11:30:00 UTC
tags: LearnDocker,LearnContainerizatio,DockerTutorial,docker
canonical_url: https://www.devteds.com/multi-stage-docker-build-tutorial/
---

In this concise tutorial, discover how to use `Docker's Multi-Stage Build` process to create production-ready Docker images. Follow our step-by-step guide to writing a multi-stage `Dockerfile` for a web application and elevate your Docker skills.

<!--continuereading-->

{% embed https://www.youtube.com/embed/EkOCLmvwEhc %}

If you’re creating a container image (Docker image) for production, image size and security are two essential considerations. Fortunately, Docker’s Multi-Stage builds can help address both concerns.

In the development environment, container images often include development and build tools, as well as dependencies necessary for the development and build process. However, these tools and dependencies can increase the image size and pose a security risk.

By using Docker’s `Multi-Stage Build` feature, we can separate the development and build stage from the final production stage of creating container images. This way, the image built for production or deployment to any environment, will only contain the necessary components for the app to run in production.

In this short video tutorial, you’ll learn how to write a multi-stage Dockerfile to create both a local development and a **production-ready** , deployable Docker image.

Here’s a breakdown of the steps you’ll learn in the tutorial:

1. Containerize an existing web application using Ruby and Ruby on Rails
2. Start with a simple Dockerfile to build for local development and test running containers locally
3. Update the Dockerfile to add a multi-stage structure, starting with 2 stages for local development setup
4. Test running the container locally, built using a multi-stage Dockerfile
5. Add more stages to package and build a final, production-ready and deployable Docker image
6. Test running the production-ready image locally using Docker Compose
Ubuntu base image for CentraSite
Tags: api, ubuntu, docker, kubernetes
Published: 2023-02-09 09:45:51

---
title: Ubuntu base image for CentraSite
published: true
date: 2023-01-11 11:13:49 UTC
tags: api, ubuntu, docker, kubernetes
canonical_url: https://tech.forums.softwareag.com/t/ubuntu-base-image-for-centrasite/268095
---

 

_products versions - CentraSite 10.11_

## Introduction

This Topic helps you in creating the Ubuntu 20.04 base images for CentraSite 10.11

## Pre-requisite

Knowlege on Docker topic

## Steps to follow

The steps required to follow for creating Ubuntu base images for CentraSite 10.11 are available in the word document attached as assets.

The scripts required to create the docker images for CentraSite CAST and CRR are also attached as assets.

## Next steps

The Ubuntu base images for CentraSite 10.11 can be pushed to the docker hub and can be used in any of the projects where OS is Ubuntu to spin up a docker container or a Kubernetes pod.

## Useful links | Relevant resources

[Creating\_CentraSite\_Docker\_images.docx](https://tech.forums.softwareag.com/uploads/short-url/20nmnqX14cJoiUoUuk0sWDo6snB.docx) (90.5 KB)  
[create\_dockerimage\_CAST.txt](https://tech.forums.softwareag.com/uploads/short-url/x6L0jEIbCPKDi7jb4kjbGtORLgc.txt) (3.8 KB)  
[create\_dockerimage\_CRR.txt](https://tech.forums.softwareag.com/uploads/short-url/4yLpoh23rxnsJZxTeo01Tg2Y9sg.txt) (4.5 KB)

[Read full topic](https://tech.forums.softwareag.com/t/ubuntu-base-image-for-centrasite/268095)
LEARN CODING LIVE for FREE, with former HARVARD lecturer Dr. Rahul Dave.
Tags: machinelearning, ai, datascience, deeplearning
Published: 2023-01-11 11:01:07

Introducing **Code with Rahul**, a one-of-a-kind **LIVE** learning experience by the former **Harvard lecturer** **Dr Rahul Dave**! Join Dr Dave from **January 13**, as he covers topics from Data Science, Machine Learning and Deep Learning in interactive **LIVE** sessions absolutely **FREE**!
 
Join Dr Rahul Dave, former Harvard lecturer and co-founder of Univ.AI, every **Friday at 10:30 AM EST / 09:00 PM IST** for the **online FREE & LIVE Data Science Workshop Series**.

**Register for the workshop here**: [CWR_BASICML](https://www.univ.ai/cwr?utm_source=Devto+&utm_medium=post+&utm_campaign=cwr)
Using ChatGPT: Examples of POST and GET API Call in JavaScript
Tags: chatgpt, javascript, programming, news
Published: 2023-01-11 10:58:59

Netizens have been talking about ChatGPT by OpenAPI and I decided to try it out. My search goes thus - "Example of get and post call in JavaScript" and below is the response I got.

In JavaScript, you can use the fetch() API to make HTTP requests, such as GET and POST requests. Here's an example of a GET request:

```
fetch("https://jsonplaceholder.typicode.com/posts/1")
  .then(response => response.json())
  .then(data => {
    console.log(data);
  });

```
This code uses the fetch() method to make a GET request to the specified URL. The .then() method is used to handle the response returned by the server. The first .then() method is used to parse the response as JSON, and the second .then() method is used to access the data and do something with it.

For a POST request, you can use the fetch() method along with the Request() constructor to specify the request method and the request body:

```
const data = { title: "foo", body: "bar", userId: 1 };

fetch("https://jsonplaceholder.typicode.com/posts", {
    method: "POST",
    headers: {
      "Content-Type": "application/json"
    },
    body: JSON.stringify(data)
  })
  .then(response => response.json())
  .then(data => {
    console.log(data);
  });

```
This code creates a JavaScript object that represents the data to be sent to the server, and then it uses the fetch() method to make a POST request to the specified URL. The headers option is used to set the Content-Type header to application/json, and the body option is used to send the data as the request body.

Please note that these are examples only and the URLs are not real endpoints, that means that you will not get a real response from these URLs.
Also, in a real-world scenario, you should also handle errors and other edge cases, and add validations, loading spinners, and other features.

What's your thought on ChatGPT?
Yet another coding journey
Tags: introduction, coding
Published: 2023-01-11 10:58:39

---
title: Yet another coding journey
published: true
date: 2023-01-11 10:49:12 UTC
tags: introduction, coding
canonical_url: https://adamrabiega.com/yet-another-coding-journey
---

![Screen with text on it saying "Do what is great"](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1ck2dniu6weyc7kq4134.jpg)

### The Who

Hi 👋, my name is Adam and I would like to welcome you to my blog. I'm a proud father of twin girls and professionally work in logistics projects and change management for a clothing manufacturer.

In this blog, I would like to share my ideas and attempt to fix struggles or issues I stumble upon during my journey, document my progress and hopefully share something useful from the mix of my experiences and unique perspectives that each of us carries in our lives.

### The Why

After reading an n-th article about how someone started with coding and seeing their progress in the following posts I always wanted to do something similar, yet never given myself the confidence to do so.

There were always many "why not's" - that I've never written like this before or that it won't bring any value to the table, but this is irrelevant in the long run. After all, the worst thing that can happen is that no one will read it :).

### The What

I'm not an IT professional or a coder, or so I always defined myself as I never completed any official courses or don't have an IT-related job title (I work in logistics, in a project management role). The thing is, however, that I do code pretty much every day.

Whether it's using AutoHotkey scripting or Python to automate tasks, using code snippets in PowerApps within Office (365) or using TypeScript and Svelte to code a resource management app, I do, indeed, code.

This revelation didn't come to me easily, as I always assumed that this is "half-baked" and not enough to be able to call myself a coder.

Wrong - whilst it doesn't make me an expert, it means to me now that I am somewhere on the journey of potentially becoming one if I wish to and the only thing standing in my way is time and motivation.

### The How

The quality of content in this blog remains to be seen, however, I will strive to continue improving with both my writing style and choice of subjects, trying not to duplicate the mundane for the 1000th time. Throughout this, if you happen to read my posts, please do leave some feedback so it can be constructive for my progress.

For reference, some of the expected topics might include JavaScript, TypeScript, Python, Svelte(Kit), PowerApps, Excel, PowerBI, PowerPoint and more.

In the meantime, thank you for tuning in and see you later.
Registration Closing Soon!
Tags: beginners, webdev, programming, hackathon
Published: 2023-01-11 10:42:30

Still Thinking? Mark your presence at
Participate Now: www.squareboat.com/code-night

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/m8cue0x6hy3gbvu4sstz.png)
OOP store design in Golang
Published: 2023-01-11 10:34:42

This is a technical article For a task given by ALTschool Africa Engineering class to design a store using OOP principles in Golang.

The requirements  of the store are as follows, the store owner needs to be able to track:

Number of cars sold
the sum of prices of cars left
number of cars sold
list of cars sold
add items to the store
sell items from the store

To implement this functionality, I came up with three different classes, Car, Product and Store. 

To follow with the principles of OOP, I had to use 
**Abstraction** by making the classes abstract method that are relevant to the solution.
The Store class had most of the methods that directly correlated to the requirements of the store owner in easy to use patterns.
The Product class also had exposed required methods for other classes to interact effectively with it.

I implemented **Encapsulation** for the classes by making sure that each of the classes had their implementation detail local to it.
The concrete types in Go were not exported and all of the internal data, I used receiver methods on the main class that exported functionality. The classes themselves were also not exported, interfaces were used as the means to interact with other classes, the concrete types implemented these interfaces

Golang doesn't have **inheritance** built in, it however has Embedding, an idea where a class can embed another class and the outer class would also have the methods of the embed class. This was the relationship between the Car and the Product as the cars was the only type on product in the store

**Polymorphism** was achieved by using interfaces, interfaces were the types required by the Store class to interact with the Product class. and the product class implemented all the methods defined in this interface, this means that the product class and any other class that has all the methods defined could be used as the required type. 

The link to this solution can be found on github - https://github.com/kelechi-otu
Make AI Help You Instead of Taking Your Job
Tags: ai, programming, productivity, career
Published: 2023-01-11 10:33:48

Using AI in the workplace doesn't have to be a threat to your job, instead, it can be a valuable tool to help you improve your work and make it more efficient. 

---

## As a software engineer, 
you can use AI to automate repetitive tasks such as:
- writing unit tests
- improving the cleanliness and security of your code
- making your code run faster 
- documenting your code
- adding comments
- improving typing

## For writers, 
AI can serve as a useful tool to:
- generate ideas and topics for articles 
- rephrase and improve existing content 
- add points and details to your writing. 
It can also serve as a starting point for new articles, providing a base for you to build upon.

## Front-end developers 
can also benefit from AI by using it to:
- automate and improve coding tasks
- make front-end-backend integration easier and faster. 
However, AI may struggle with creating good designs as code so designers may provide a baseline.

## Cyber Security
AI can be used to:
- automatically detect and prevent cyber attacks
- monitor network traffic for suspicious activity.
It can also help organizations with compliance and threat intelligence.

## Data Scientists
AI can help with:
- data cleaning
- feature engineering
- model selection
and also increase the accuracy and speed of predictions. 
By automating these tasks, data scientists can focus on more important work such as data interpretation, business strategy and identifying new opportunities.

---

Overall, AI can be a powerful tool in the workplace, but it should be used in conjunction with human intelligence, rather than as a replacement for it. 

You can see how it would change the work flow of every role, for example as a writer you should search for ideas and topics, compare which the best, get references for your article, write it all. 

However, with the new AI capabilities it may change the way you work, instead of doing this, you would think on how to write the input, and give the AI a good baseline to start with.

By harnessing the capabilities of AI, we can work smarter and more efficiently, ultimately allowing us to achieve greater success in our roles.

Also, this article is made with the help of AI.
Thus The New Journey Begins
Tags: opensource, leadership, learn, osdc
Published: 2023-01-11 10:29:48

|OSDC Series|
| --- |
|[Thus The New Journey Begins](https://dev.to/silent_mobius/thus-the-new-journey-begins-18kp)|
|[Journey Of Thousand Pages](https://dev.to/silent_mobius/journey-of-thousand-pages-152k)|
|[Journey Journal](https://dev.to/silent_mobius/journey-journal-3dm1)|


Welcome dear reader. I am your faithful author Silent-Mobius, also known as Alex M. Schapelle. 
It is possible that you have read one of my articles before, which you can find under my profile here, to which your "like"s and comments i'll be glad to read.
Yet this short article will not feature any technical matter, but more person note, that reads as follows:
I have joined @szabgab's Open-Source-Development-Course or #OSDC for short. The course focuses on #opensource development and management in wide team of enthusiastic developers who join me mainly but not only, to learn and prosper within flock.
Let us wish ourselves good luck and happy learning to
@adieg @dshisher  @shanibmo @ilayni  and to others who's users I can not find yet.
In case one of you would like to contribute to my silent-repos, you are welcome to edit [my linux book](https://gitlab.com/silent-mobius/linux-training-book), in case you are more code oriented and wish to contribute to code, I have [mazin-docker](https://gitlab.com/vaiolabs-io/mazin-docker) project that might peak your interests.
Updated KVS Syllabus 2023 for TGT,PRT and PGT- PW
Tags: kvs, exam, kvsexam, kvs2023
Published: 2023-01-11 10:26:28

Knowing the syllabus is the first step to achieving the goal. Applicants should have a good understanding of the syllabus of [KVS 2023](https://www.pw.live/tet/kvs), TGT, PGT and PRT teachers.
JetBrains Fleet One Dark Pro theme
Tags: programming, showdev, community, tooling
Published: 2023-01-11 10:25:25

Hello everyone!

I am excited to announce the release of my new (and first) custom color scheme for JetBrains Fleet, called "One Dark Pro" based on theme with same name for vsc.


This scheme is based on the popular One Dark Pro theme, and it features a dark background with contrasting colors, making your code easy to read and visually appealing. It's perfect for those who want to give their JetBrains Fleet experience a fresh look and improve their productivity.


The color scheme is available in the form of a .json
file and it's very easy to install. Simply download the file and import it into JetBrains Fleet. You'll find instructions in the file on how to do this.


If you're interested in giving that theme a try, you can find the file on my GitHub repository.


I hope you enjoy using my new custom color scheme, and I would love to hear your feedback! If you have any issues or suggestions for improvements, please let me know!


repository: https://github.com/sectasy0/fleet_one_dark



![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jq4piipzoegdtebaqvg9.png)


Thanks!
Wednesday Links - Edition 2023-01-11
Tags: java, jvm, jpa, graalvm
Published: 2023-01-11 10:24:21

Build JPA queries using standard Java streams (30 sec)❓
https://twitter.com/piotr_minkowski/status/1610766094091882509

Automate the mapping between entities and DTOs using the Blaze Persistence (30 sec)🪒
https://twitter.com/piotr_minkowski/status/1612476870993350656

Oh... This is Prod?! (2 min)🤦‍♂️
https://www.morling.dev/blog/oh_this_is_prod/

On PBKDF2 iterations (6 min)🔒
https://neilmadden.blog/2023/01/09/on-pbkdf2-iterations/

GraalVM now breaks down the code area by module name, JAR file, package name, and class name (30 sec)🖖
https://twitter.com/fniephaus/status/1612713032353828864

Java 20: Colossal Sparse Memory Segments (4 min)🗿
https://minborgsjavapot.blogspot.com/2023/01/java-20-colossal-sparse-memory-segments.html
Agile vs DevOps: Which is the Right Methodology for Your Business?
Published: 2023-01-11 10:22:11

Agile and DevOps are two popular software development approaches that are often used together to create a more efficient and effective development process. However, they are not the same thing and have some distinct differences.

Agile is a set of values and principles for software development that emphasizes flexibility, speed, and collaboration. It promotes the idea of "release early and often" and encourages developers to work in short, iterative cycles called sprints. Agile also emphasizes the importance of communication and frequent feedback from stakeholders.

DevOps is a set of practices and tools that aims to automate and streamline the software development process. It aims to bring development and operations teams together to work more closely and efficiently, with the goal of reducing the time it takes to get new features and updates out to users. DevOps emphasizes continuous integration, continuous delivery, and automation.

One key difference between Agile and DevOps is that Agile is more focused on the development process itself, while DevOps is more concerned with the entire software development lifecycle. Agile is primarily concerned with how to create software in a more flexible and responsive way, while DevOps focuses on how to get that software into the hands of users as quickly and efficiently as possible.

Another key difference is that Agile is more focused on the development team, while DevOps is more concerned with the entire organization. Agile is primarily concerned with how developers can work together more effectively, while DevOps is focused on how to get the entire organization – including development, operations, and other teams – to work together more effectively.

Despite these differences, Agile and DevOps are often used together because they both share a common goal: to create a more efficient and effective software development process. By combining the values and principles of Agile with the practices and tools of DevOps, organizations can create a development process that is faster, more flexible, and more responsive to the needs of users.
How to set mongoose schema field from list of strings (enum)
Tags: mongodb, mongoose, codever, snippets
Published: 2023-01-11 10:19:47

In the following example we define `template` attribute to be of type `String` with values defined in the `enum` array:

```javascript
const noteSchema = new Schema({
    title: {type:String, required: true},
    type: {type:String, required: true, default: 'note'},
    content: String,
    reference: String,
    tags: [String],
    template: {type:String, enum: ['note', 'checklist']},
    userId: {type: String, ref:'User'},
    __v: { type: Number, select: false}
},
{
  timestamps: true
});
```

<hr/>

> Shared with :heart: from [**Codever**](https://www.codever.dev/snippets/63b8562e3b43b9521ed04b0d/details). Use :point_right: [**copy to mine**](https://www.codever.dev/snippets/63b8562e3b43b9521ed04b0d/details) functionality to add it to your personal snippets collection. 
> 
> **Codever** is open source on [Github](https://github.com/CodeverDotDev)⭐🙏