teleren/devto huggingface dataset:
JavaScript objects for beginners
Tags: javascript, beginners, programming, tutorial
Published: 2023-09-18 09:27:15

**Hey guys**

From HackerRank challenge [7 Days of JavaScript ](https://www.hackerrank.com/contests/7days-javascript/challenges)  Day 2: objects

**First of all, What are objects?**
Objects are variables too, but objects can contain many values. 
another definition is the object is a different way of organizing information in JavaScript

**for example**
`var myObject = {type:"Kia", model:2023, color:"red"};`

**Accessing Object Properties**
You can access object properties in two ways:
`objectName.propertyName`  or  `objectName["propertyName"]`

**Task 1**
In this example, you are given a single line consisting of property type values of a car in the following order:

`TypeName ModelName ColorName`

These values are assigned to an object car that has the properties type, model, and color (read the code in the editor carefully to learn how that is done). Your task is to complete the code to print the object.

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

Take your time and think about a solution then check my solution.

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

**The next step learning how displaying Information contained in Objects**


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

I'm thinking of using if statement for the condition and I'm taking a long time to think about how to iterate over an object variable. loop!! yes using for statement.

Do you write code? If yes or no you can check my solution.


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

That's all the things I'm learning today what about you?

let's share our knowledge and tell me what you learned today.

Here are my social links if you would like to follow.

Github: https://github.com/EsraaNasr92/
Twitter / X: https://twitter.com/Esraa_nasr92
Instgram: https://www.instagram.com/_esraaanasr/
Llama 2 in Apple Silicon Macbook (1/3)
Published: 2023-09-18 09:25:55

This post describe how to use Llama 2 in Apple Silicon Macbook.

# Download model

To download Llama 2 model from Meta, 

[https://ai.meta.com/llama/](https://ai.meta.com/llama/)


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

After fill up the form, you will get email from Meta.

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

The title of email is **_"Get Started with Llama 2"_**


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



# Clone Git repository

To download Llama 2 model, you need to download git repository first.

```
git clone https://github.com/facebookresearch/llama.git
```

In this repository, there is **download.sh** file.

```
cd llama
/bin/bash ./download.sh
```

Put URL link from email. Then model what you want to download.
In my case, I downloaded **7B-chat**

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

After download finished, there is a folder **"llama-2-7b-chat"**.


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


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



The file format **consolidated.00.pth** is **PyTorch** model file.

_This is end of downloading Llama 2 model._

**Next Step. Llama 2 in Apple Silicon Macbook (2/3)**.
https://dev.to/choonho/llama-2-in-apple-silicon-macbook-23-2j51

# Reference

https://medium.com/@karankakwani/build-and-run-llama2-llm-locally-a3b393c1570e
https://github.com/rustformers/llm/blob/main/crates/ggml/README.md


# Series
Llama 2 in Apple Silicon Bacbook (1/3)
https://dev.to/choonho/llama-2-in-apple-silicon-macbook-13-54h

Llama 2 in Apple Silicon Bacbook (2/3)
https://dev.to/choonho/llama-2-in-apple-silicon-macbook-23-2j51

Llama 2 in Apple Silicon Bacbook (3/3)
https://dev.to/choonho/llama-2-in-apple-silicon-macbook-33-3hb7
Supabase realtime changes in Nuxt
Tags: nuxt, vue, javascript, webdev
Published: 2023-09-18 09:17:21

When working with databases, I always find it difficult to create a mechanism that would allow to listen to changes on the database records. And this is such a useful functionality. 

Let's imagine that our Frontend application can refresh the list of items when any of them changes in the database. That would have been awesome.

Thankfully, once again Supabase is there to help in the easiest way possible!

## Code

Let's say that we have a table in our Supabase dashboard named `cats` and we are fetching them like this:

```html
<script setup lang="ts">
const client = useSupabaseClient()

const { data: cats, refresh: refreshCats } = await useAsyncData('cats', async () => {
  const { data } = await client.from('cats').select('name')
  return data
})
</script>
```

This is quite a normal approach to fetching data. But how could we listen to the changes and refresh our cats data once there is a change in Supabase?

Let's take a look at the following code sample:

```html
<script setup lang="ts">
import type { RealtimeChannel } from '@supabase/supabase-js'

let realtimeChannel: RealtimeChannel
 
onMounted(() => {
  realtimeChannel = client.channel('public:cats').on(
    'postgres_changes',
    { event: '*', schema: 'public', table: 'cats' },
    () => refreshCats()
  )
  realtimeChannel.subscribe()
})
</script>
```

Let's stop for a second to explain each step here:

1. We are importing the `RealtimeChannel` type to have full type safety and completion.
2. We are calling `client.channel()` method on public table called `cats`.
3. We are reacting on `postgres_changes` for all events in public schema for table cats.
4. After each such event, lets refresh the cats data by `refreshCats()`
5. We also subscribe to this realtimeChannel.

This allows us to listen for these changes and react for them in our Frontend.

Finally, remember to unsubscribe whet the user left the page:

```html
<script setup lang="ts">
onUnmounted(() => {
  client.removeChannel(realtimeChannel)
})
</script>
```

You can check more details about both Supabase and Realtime channels [here](https://supabase.nuxtjs.org/usage/composables/usesupabaseclient#realtime)
Flowchart editor dgrm.net / Announcement / Live collaboration
Tags: javascript, webdev, programming, productivity
Published: 2023-09-18 09:07:59

I added live collaboration to [https://dgrm.net](https://dgrm.net).

Now it is convenient to hold meetings, brainstorming and interviews.


![live collaboration](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hk1cqcjtfgprhbuyz2vb.png)
CodeWiz Has Launched on Product Hunt! My Heart? Racing. My Palms? Sweaty.
Tags: buildinpublic, webdev, productivity
Published: 2023-09-18 09:04:56

Hello Dev.to tribe! 🌟

Today's the day! After nights of coding, debugging, more coding, and (let's admit it) a few breakdowns, CodeWiz has officially launched on Product Hunt!

https://www.producthunt.com/posts/codewiz

Honestly? I'm terrified. The emotions are high, the nerves are jittery, but the hope? Skyrocketing. As a solo-maker, there's a raw vulnerability in putting something so close to your heart out into the wild. CodeWiz isn't just lines of code; it's my story, our collective developer dreams, and a vision for better coding days.

If you ever wished for a coding partner that just "gets it," perhaps CodeWiz might just be that pal. Check it out, play around, and share your thoughts. Your feedback is the magic potion that will keep this wizardry alive and spellbinding.

https://www.producthunt.com/posts/codewiz

Join me in this roller-coaster of emotions and celebrate this tiny-big milestone. Your support, as always, is the wind beneath CodeWiz's wings (or should I say, broomstick? 🧹).

Thank you for being a part of this journey. Here's to making coding a tad more magical! 🍾

With all the jitters and joy,

Pietro Lungarini
Your Friendly Neighborhood Code Wizard. 🧙‍♂️
How to Run dbForge Studio for MySQL on Ubuntu With Wine
Published: 2023-09-18 08:58:25

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2nxmi5gp80824042g7ur.jpg)

In recent years, Linux has witnessed a remarkable surge in popularity as a robust and dependable operating system, serving a diverse user base ranging from casual enthusiasts to seasoned software developers. As Linux continues to establish itself across various industries, there is a growing demand for software tools and applications originally designed for Windows environments to be seamlessly installed and utilized on the Linux platform.

This article addresses the imperative need to bridge the gap between Windows-centric applications and the expanding Linux user community. We delve into the process of installing and running dbForge Studio for MySQL on a Linux environment by leveraging Wine. By harnessing the capabilities of Wine's compatibility layer, developers can access the Studio without compromising their preferred choice of operating system.

Read more: https://blog.devart.com/how-to-run-dbforge-studio-for-mysql-on-ubuntu-with-wine.html
Men's Skincare Unveiled: Tips from Dermatologists
Tags: skincare, glow, nourishment
Published: 2023-09-18 08:55:28

Gentlemen, it's time to take the reins of your skincare routine and unlock your [skin's](https://skyntox.com/blogs/skincare/best-skincare-routine-for-men-recommended-by-dermatologist) potential! Dermatologists are sharing their expert insights to help you achieve and maintain healthy, radiant skin. 💪🌟

In this comprehensive guide, you'll dive into:

✅ Understanding your skin type
✅ The power of proper cleansing
✅ The art of exfoliation
✅ Sun protection secrets
✅ The importance of hydration
✅ Targeted solutions for specific skin concerns
✅ Lifestyle choices that impact your skin

Say goodbye to skincare confusion and hello to a confident, well-groomed you. Your journey to healthier, more vibrant skin starts here! 🚀💼
Modify colors of Angular Material Button
Tags: angular, angularmaterial, scss, typescript
Published: 2023-09-18 08:42:52

---
title: Modify colors of Angular Material Button
published: true
description: Let’s look and learn how to make the style changes effectively
tags: angular,angularmaterial,scss,typescript
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yktkf2z2t4kc03hf9tzd.jpg
---

Struggling with changing colors of angular material buttons?

Not anymore! Read on...

Let’s assume that you have added Angular Material in your project and selected a pre-built theme to use.

We will create a `custom-theme`, which should get applied only when it’s inside `.custom-theme` class.

```scss
@use "@angular/material" as mat;

$custom-primary: mat.define-palette(mat.$pink-palette, 700, 500, 900);
$custom-accent: mat.define-palette(mat.$blue-grey-palette, A200, A100, A400);

$custom-theme: mat.define-dark-theme(
  (
    color: (
      primary: $custom-primary,
      accent: $custom-accent,
    ),
  )
);

.custom-theme {
  @include mat.button-theme($custom-theme);
}
```

Note that we have only included `button-theme`, because in our demo we only use that component. You can also use `all-component-theme` mixin to add all components’ themes, but it will increase the size of the final output style.

So, now with the above code, if in the HTML code, we simply wrap the buttons in `custom-theme` class, it will apply custom-theme to components inside it. Let’s look at the output:

![output](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lyd1wkfvarhlprj3615i.jpg)

That's a wrap!

For more details, read full article at:

{% embed https://angular-material.dev/articles/customizing-angular-material-button %}
Do you want to recover your cryptocurrency?
Published: 2023-09-18 08:42:24

I never believed I could recover all my funds back to my wallet, my colleague introduced a professional hacker to me ADRAIN LAMO HACKER AGENCY, and this hacker recovered the $766,000 that was stolen from me by these online scammers. ADRIAN LAMO HACKER AGENCY recovered all my funds within 24 hours. If you’re a victim I do advise you to consult These professional hacker via email: Adrianlamo@consultant.com
Clean Comparisons
Tags: php, webdev, programming, cleancode
Published: 2023-09-18 08:42:00

---
title: Clean Comparisons
published: true
description: Make Your Comparisons Readable
tags: PHP, webdev, programming, cleancode
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tyqwel54koij7z4ljl57.jpg
---

In programming, readability is just as crucial as functionality. One area that often gets overlooked is the way we write comparisons. Using ambiguous comparisons can make your code harder to understand and lead to unexpected bugs. In this post, we'll look at how to make your comparisons in PHP and JavaScript both readable and reliable.

## Readable PHP Comparisons

Beyond being a dynamic language, PHP has some weird and unexpected behavior when casting values. For instance, if you have a string with a zero, it will evaluate to false if you do `!$string`.

So, in PHP, you are incentivized to do explicit comparisons not just for readability but also for correctness.

| Check              | Ambiguous form      | Clear replacement                |
|--------------------|------------------------|----------------------------------|
| Is array empty?    | !$list               | $list === []                   |
| Is array empty?    | empty($list)         | $list === []                   |
| Is string empty?   | !$string             | $string === ''                 |
| Is int zero?       | !$int                | $int === 0                     |
| Is null?           | !$typeOrNull         | $typeOrNull === null           |
| Scalar equals?     | $a == $b   | $a === $b            |
| Array key exists?  | isset($list[$a])     | array_key_exists($a, $list)    |
| Is null or false?  | !$mixed              | $mixed === null &#124;&#124; $mixed === false |

## Readable JavaScript Comparisons

| Check               | Ambiguous form   | Clear replacement         |
|---------------------|---------------------|---------------------------|
| Is array empty?     | !arr.length       | arr.length === 0        |
| Is string empty?    | !str              | str === ''              |
| Is number zero?     | !num              | num === 0               |
| Is null?            | !val              | val === null            |
| Is equal?            | a == b              | a === b  

## More Comparisons

What did I miss? Do you disagree with any of the above? Let me know in the comments!
Beta testing: PVS-Studio plugin for VS Code checks .NET projects
Tags: dotnet, vscode, csharp
Published: 2023-09-18 08:20:11

The release of PVS-Studio 7.27 is on the horizon. So today, we'd like to invite you to take part in the beta testing of the PVS-Studio plugin for Visual Studio Code. The upcoming update may be of particular interest to C# developers, as the plugin now supports analysis of .NET projects. You'll also get to try out a more user-friendly UI.

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

Beta testing will continue until early October, when we will release the plugin and make it available to all users.
To try out the updated plugin now, follow the [link ](https://pvs-studio.com/en/pvs-studio-eap/)and sign up for beta testing. 

You will receive an email containing links to the plugins, installation instructions, and a temporary PVS-Studio license. It's free. Do you know someone who might also be interested? It would be great if you could share this article with them.

If you encounter any bugs, crashes, analysis issues, or strange messages while using the plugin, please email us in response to an email you will receive or via the [contact form](https://pvs-studio.com/en/about-feedback/). Any comments, bug reports, and suggestions are welcome.
Rails 7. Start Kit Loves Nginx
Tags: rails, development, docker, startup
Published: 2023-09-18 08:14:51

[Rails 7. Start Kit](https://github.com/the-teacher/rails7-startkit) is a great choice for any kind of startups and developers who wants to save time in launching a new Rails application on any platform.

{% youtube f6aAwAMH4Q8 %}


At this weekend I've added NGINX to my start kit setup.

Time to time it is important to debug and check an application in mode that is close to the real production environment. Using NGINX helps to do it. I have added certificates to provide access via `https`.

In this [PULL REQUEST](https://github.com/the-teacher/rails7-startkit/pull/41) You can check changes related to the enhancement.

## /etc/hosts

To have an access to the project on local machine do not forget config your `/etc/hosts` file

<img width="797" alt="Screenshot 2023-09-18 at 10 12 29" src="https://github.com/the-teacher/rails7-startkit/assets/496713/9f740e81-db95-4b7b-976a-55b42394dc42">
<img width="700" alt="Screenshot 2023-09-18 at 10 12 04" src="https://github.com/the-teacher/rails7-startkit/assets/496713/fab9a943-0891-41b5-adfa-0959a2793c1e">


## How it looks

| http | https | certificate |
| -- | -- | -- |
| <img width="1008" alt="Screenshot 2023-09-17 at 14 36 32" src="https://github.com/the-teacher/rails7-startkit/assets/496713/a075267d-5f64-4c20-9d80-e45370a551c5"> | <img width="1039" alt="Screenshot 2023-09-17 at 15 35 27" src="https://github.com/the-teacher/rails7-startkit/assets/496713/047a4c76-4866-44af-b5ce-11daf66c9b18"> | <img width="555" alt="Screenshot 2023-09-17 at 15 39 00" src="https://github.com/the-teacher/rails7-startkit/assets/496713/6db1e6b9-67e5-4b03-9e67-3b46c84ccf5a"> |

## Naming and Conventions note

Time to time people ask me, - "Why do you name configuration files so?". They mean that I **underscore and uppercase** some configuration files and folders like you can see it here:

<img width="463" alt="Screenshot 2023-09-18 at 10 02 18" src="https://github.com/the-teacher/rails7-startkit/assets/496713/faf5e265-39e4-48e6-a48d-494863b07726">

I do it to highlight some important configuration files, folders and other stuff for demonstration and education purposes.

If you do not like naming like that or my way to place configuration files - you always can change it following your personal preferences. 

### One-liner for launching `Ruby on Rails`

❤️ **Linux / MacOS**

```sh
git clone https://github.com/the-teacher/rails7-startkit.git && \
  cd rails7-startkit && \
  ruby bin/setup
```

💙 **Windows**

```sh
git clone https://github.com/the-teacher/rails7-startkit.git & cd rails7-startkit & ruby bin/setup
```

### Prerequisites

On your host you have to have:

- **Any version** of Ruby
- **Any version** of Git
- **Any version** of Docker

### Like, Share, Tell to your Colleagues 

👉 The project needs for your help to make it helpful for as much people is it possible.

Please Like 👍 , Share 💁   and Tell 📣 to your Colleagues! 

❤️ Happy coding with [Rails 7. Start Kit](https://github.com/the-teacher/rails7-startkit)
Angular CLI Cheat Sheet: The CLI command An Angular Developer Should Know
Published: 2023-09-18 07:59:40

Angular is one the most popular javascript front-end framework for creating full-fledged web applications. Angular comes with command line interface to the development faster.In this article, We will see the CLI commands a developer should know.

### What is Angular CLI? 

Angular CLI is a command-line interface that is used to create Components, Services, Pipes, modules, and more. It is very helpful for the developers and makes the development faster.

Now we will see the list of commons which a Angular developer should 

1. **ng new <application name>:** This command mainly creates a new Angular application
2. **ng new <application name> --prefix best:** This command creates a new Angular application and set the projects prefix to new.
3. **ng new --help:** This command mainly list Angular command.
4. **ng lint my-app:** This command checks the selected application for any linting warning
5. **ng lint my-app --fix:** It helps in fixing linting error, if there is any
6. **ng lint my-app --format stylish:** This formats entire codebase.
7. **ng lint my-app --help:** This command list all the available linting command list.
8. **ng generate directive <directive name>:** This command generates a new directive. This command can also be written as **ng g d <directive name>.**
9. **ng generate component <name>:** This command mainly creates a new components. This command can also be written in short form as **ng g c <name>** 
10. **ng g s <service name>:** This command is used to create a new service.
11. **ng g p <pipe name>:** It helps to create a new pipe in our application
12. **ng g cl <destination>:** It helps to create a new class in specified directory.
13. **ng build:** It helps to create a development build of our Angular application.
14. **ng build --prod:** It helps to create production build in angular application.
15. **ng serve -o:** It serves the application by opening up the application in a browser using any port 4200 or any other.
16. **ng serve -ssl:** Serves the application using SSL.

In this article, I tried to brief the common Angular CLI command any Angular developer should know.

Let me know your thoughts over the email pankaj.itdeveloper@gmail.com. I would love to hear them and If you like this article, share it with your friends.

Thanks,

This article is originally posted over [jsonworld](jsonworld.com)
[Intro] 🙌 Introduction to "CodeArts": One-stop DevSecOps Platform
Tags: devops, devsecops, beginners, cloudcomputing
Published: 2023-09-18 07:57:34

**CodeArts Introduction:**

CodeArts is a one-stop software development platform that integrates Huawei’s nearly 30 years of R&D capabilities and practices, cutting-edge R&D concepts, and advanced R&D engineering capabilities. It provides you with a high-quality cloud-based development experience to make software development simpler and more efficient. CodeArts covers the software delivery life cycle, supports full life cycle software development services such as requirements management, code hosting, pipeline, code inspection, compilation, deployment, testing, etc.; Supports IPD, DevSecOps, agile methodologies, Kanban, CI/ CD continuous delivery and other mainstream R&D models; covering embedded, cloud services, microservices, mobile applications and other application development scenarios; built-in requirements management, code inspection, test management and many other Huawei R&D specifications.

Product Link: https://www.huaweicloud.com/intl/en-us/product/devcloud.html

**The Sandbox Environment Introduction:**

Through the CodeArts sandbox environment, users can use CodeArts, to test and learn the whole process of cloud development from project planning, requirements management, code development, cloud deployment, release and testing, to quickly experience and understand the one-stop DevOps development process.

**User Benefits:**

Using CodeArts for R&D management and iterative release to master the management of project planning using requirements management services. In software development environments where requirements change frequently, development and test environments are complex, multi-branch maintenance will be difficult, and progress and quality cannot be effectively monitored. CodeArts can be used as a one-stop cloud services for the whole software development process.

**Target Users:** All developers

**Sandbox Environment Fees:**

1) Experiment Name: Planning & Design by CodeArts (Basic) – FREE

https://lab.huaweicloud.com/intl/en-us/testdetail_1931

2) Experiment Name: Planning & Design by CodeArts – FREE

https://lab.huaweicloud.com/intl/en-us/testdetail_1930

3) Experiment Name: Deployment & Release by CodeArts – Involves purchasing ECS fees (0.1204 USD/hour; 0.114 USD/GB)

https://lab.huaweicloud.com/intl/en-us/testdetail_1932