teleren/devto huggingface dataset:
THE PYTHON BLUEPRINT: A Beginners Guide to getting started
Tags: python, beginners, programming, developer
Published: 2024-06-09 19:18:22

**What is Python Language**

Python is a backend tool that is used by programmers and tech developers. It's objective/Use cuts across different sectors of programming including:

1. Web development.
2. Data service.
3. Artificial Intelligence.
4. Gaming.


**Merits of Python Language**

Firstly the Python is generally shorter to write than other languages like javascript which reduces ambiguity.

Secondly python is a cross platform language meaning that a python code on Mac Os can be ran on Windows without change of code pattern.

Thirdly Python has a large community so getting online colleagues and mentors is not a problem at all.

**Getting Started**

 This is the real deal, the easiest way to start your python language is as follows:

1. Download a suitable python application on your operating system from the official python website. 

2. Choose a text editor like  Notepad++, Sublime Text, or Atom or  an  Integrated Development Environment(IDE) like Spyder or Pycharm.

3. Learn basic Syntax: Start with basic ones like numbers variables and Strings.

4. Engage tutorial resources online.

5. Join social media python communities.

With this you are on the right track to becoming a python guru.
Tool to create quick mockup
Tags: discuss
Published: 2024-06-09 19:07:42

I am a developer, not a designer, but I want to write about UI and I want to include example UI images. What is a tool that y'all use to quickly create a sharable or embeddable image to accompany your writing here on dev.to?

I don't want a tool so in-depth that I have to spend a lot of time to figure it out. It would be lovely if the tool had some generic components, buttons and placeholder, but I am also open to a Publisher-like tool. I am on a Mac and would prefer a free-ish tool.

For example, a designer at work made a very complex modal design that had multiple animation, interactions and a vertical scroll. I would like to write about the things I don't like about the design and how I would have designed it differently and why. Since it's based on proprietary details, I want to find a tool to recreate an image of it in a more generic way.
HackerRank SQL Preparation: Weather Observation Station 1(MySQL)
Tags: sql, writeups, hackerrank, mysql
Published: 2024-06-09 18:31:33


**Problem Statement:**
Query a list of CITY and STATE from the **STATION** table.

**Link:** [HackerRank - Weather Observation Station 1](https://www.hackerrank.com/challenges/weather-observation-station-1/problem)

**Solution:**

```sql
SELECT CITY, STATE FROM STATION;

```

**Explanation:**

- `SELECT CITY, STATE`: This part of the query specifies that you want to retrieve the `CITY` and `STATE` columns from the **STATION** table.
- `FROM STATION`: Indicates that you are selecting data from the **STATION** table.
HackerRank SQL Preparation: Japanese Cities' Names(MySQL)
Tags: sql, mysql, writeups, hackerrank
Published: 2024-06-09 18:24:42


**Problem Statement:**
Query the names of all Japanese cities in the **CITY** table. The `COUNTRYCODE` for Japan is `JPN`.

**Link:** [HackerRank - Japanese Cities Name](https://www.hackerrank.com/challenges/japanese-cities-name/problem)

**Solution:**

```sql
SELECT NAME FROM CITY WHERE COUNTRYCODE = 'JPN';
```

**Explanation:**

- `SELECT NAME`: This part of the query specifies that you want to retrieve the `NAME` column from the **CITY** table.
- `FROM CITY`: Indicates that you are selecting data from the **CITY** table.
- `WHERE COUNTRYCODE = 'JPN'`: This condition filters the rows to include only those cities where the `COUNTRYCODE` is 'JPN' (Japan).
Beaches frontend
Tags: devchallenge, frontendchallenge, css, javascript
Published: 2024-06-09 18:16:32

_This is a submission for [Frontend Challenge v24.04.17]((https://dev.to/challenges/frontend-2024-05-29), Glam Up My Markup: Beaches_

## What I Built
Using the html provided, custom features were added to provide better user experience. Some of these features are:
1. Custom font using google fonts - inter
2. Theme toggle into light or darkmode
3. Images using javascript insertBefore.

## Demo
<!-- Show us your project! You can directly embed an editor into this post (see the FAQ section from the challenge page) or you can share an image of your project and share a public link to the code. -->
Check out the live demo here:
https://screeching-steel-present-friends-production.pipeops.app/

the github code repo:
https://github.com/abel-otegbola/Frontend-Beaches

<!-- We encourage you to consider adding a license for your code. -->

<!-- Don't forget to add a cover image to your post (if you want). -->


<!-- Thanks for participating! -->
vue mess detector
Tags: vue, nuxt
Published: 2024-06-09 18:12:34

I started to put together a static code analysis tool for detecting code smells and best practice violations in Vue.js and Nuxt.js projects.

Vscode extension is coming soon.

[https://github.com/rrd108/vue-mess-detector](https://github.com/rrd108/vue-mess-detector)
Day 13 of my progress as a vue dev
Tags: webdev, vue, typescript, tailwindcss
Published: 2024-06-09 17:34:53

**About today**
Today was one of the good day, I learned a  few new programming approaches and a lot more things on how I wanna give direction to this journey I'm on. Basically, this journey is all about being disciplined, learning more about things, and polishing my craft, and also to achieve something along the way to showcase the proof of my achievements. So far, it has been fun, bumpy and somewhat satisfying, but not perfect. I have been learning new something each day and apply it to see what sticks and what feels most natural to me, and I think I got it figured up  to 80%.

**What's next?**
I will keep on doing what I'm doing. Going to dive deep into vue and try take on a more complex project next that will put my learning to test and will upload that on my git for public to help my out in improving that, if they want.

**Improvements required**
I just got started on this journey and my experience is relatively short, but what I have in my is to keep on going at it continue it for a long time till it becomes effortless and starts to feel natural and I start seeing some results from it. 

Wish me luck!
Take me to the beach: Frontend
Tags: devchallenge, frontendchallenge, css, javascript
Published: 2024-06-09 17:54:37

_This is a submission for [Frontend Challenge v24.04.17]((https://dev.to/challenges/frontend-2024-05-29), Glam Up My Markup: Beaches_

## What I Built
 Welcome to our curated list of the best beaches in the world. Hover over the gallery of beaches for detailed information about each beach and where they are located
<!-- Tell us what you built and what you were looking to achieve. -->

## Demo
Link to the website {% embed https://dev-challenge-beaches.vercel.app %}
A link to the code on Github {% embed https://github.com/Gyemfa-Gloria-Abedi/dev-challenge-beaches.git %}
<!-- Show us your project! You can directly embed an editor into this post (see the FAQ section from the challenge page) or you can share an image of your project and share a public link to the code. -->

## Journey
I began by understanding the challenge and generated ideas on how to go about the challenge. 
Since it is obligatory to not manipulate the HTML structure, I used javascript to manipulate the DOM and CSS to add images and attain flip effect on hover of an image to achieve the desired outcome. Also, I leverage AI  for assistive development. 
All images are from google images.
I finally deployed site using vercel 

This project was a valuable learning experience in creating dynamic, interactive web content using JavaScript and CSS. I'm particularly proud of the adaptive approach and the smooth animations achieved. Moving forward, I hope to enhance the solution further by optimizing performance, ensuring improved accessibility, and expanding functionality


Feel free to comment, all reviews are welcome

<!-- Thanks for participating! -->
Can you beat the 'Maze Of Monsters'?
Tags: terminal, python, codene, discuss
Published: 2024-06-09 17:48:06

Hello Dev.To community. This is my first post and it's the final step to my Codecademy training class in Python. My final project was to create a game/tool using Python code that could be run in the Terminal of your computer. The idea that I ended up going with was the "Maze Of Monsters" where you have to complete 5 stages in the maze by defeating the Monster at each stage. There are 3 races and 3 roles to choose from that provide different stats, which can be upgraded as you progress through the maze.

I have a "ReadMe" file on the Git repo that explains the how the game mechanics work, which is helpful to understand before journeying into the maze. Once you understand the game, you can download the Python file and run it in your terminal. I'm not super confident that the game is very balanced, but I did my best to make challenging with the limitations of the framework I created.

There are also several ways that the code could be refactored to be cleaner and/or more efficient. However, because this was my first attempt at creating a fully functioning game, I was desperate to get it working regardless of how I got there. When I end up coding another game in the future, I'm hoping it will be much more efficient with the lessons I've learned through this project.

Would love to know some tips about making the code more efficient and how I could use Python _classes_ to remove some redundant code. Appreciate any help on this!

[GitHub Repo Link](https://github.com/brysonnobles/cc_python_project/blob/main/MoM.py)
Deploying a Web Socket Application on Kubernetes
Tags: websocket, kubernetes, devops, tutorial
Published: 2024-06-09 17:44:53

## What is a WebSocket
WebSocket is a computer communications protocol, providing a simultaneous two-way communication channel over a single Transmission Control Protocol (TCP) connection. [[Wikipedia]](https://en.wikipedia.org/wiki/WebSocket)

Deploying a WebSocket application on Kubernetes can seem daunting, but this guide will simplify the process for you.

## Prerequisites
1. A running kubernetes cluster.
2. A WebSocket app to be deployed.
3. Docker to containerize that application.

You can get a sample websocket app from this github repo [adilansari488/websocket-sample-app](https://github.com/adilansari488/websocket-sample-app).

Now let's create kubernetes manifest files.

## Manifest files

Deployment.yaml
```yaml
apiVersion: apps/v1
kind: Deployment
metadata:
  name: ws-app-deployment
  namespace: default
  labels:
    app: ws-app
spec:
  replicas: 1
  selector:
    matchLabels:
      app: ws-app
  template:
    metadata:
      labels:
        app: ws-app
    spec:
      containers:
        - name: ws-app
          image: ws-app:latest
          imagePullPolicy: Always
          securityContext:
            privileged: true
          ports:
            - containerPort: 8819
          resources:
            limits:
              cpu: 1000m
              memory: 1000Mi
            requests:
              cpu: 100m
              memory: 100Mi

```

Service.yaml
```yaml
apiVersion: v1
kind: Service
metadata:
  name: ws-app
  namespace: dev
spec:
  selector:
    app: ws-app
  ports:
    - name: ws-app
      port: 8819
      targetPort: 8819

```

In above manifest files, I have declared port no. 8819 for my websocket app but it can be any port on which your app will run.

## Deploying to kubernetes
- Now build a docker image of your application or use [this repository](https://github.com/adilansari488/websocket-sample-app.git) or directly use this docker image [adilansari488/websocket-app](https://hub.docker.com/r/adilansari488/websocket-app) to test.
- Now apply *deployment.yaml* and *service.yaml* to your k8s cluster and get the IP of your service.
![Apply manifest](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jynmwm695754shbsfte5.png)

![get service ip](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3p4tsm8cut8sgjlqxnqg.png)

- Now update the service ip in your client.py and test the connection.

![update ip in client.py](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ho9fzn76ht0atmfq4rss.png)

![test using client.py](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y2bo0gvq4r0z97n8k8js.png)


## Conclusion
Congratulations! You’ve successfully deployed your first websocket application. If you found this helpful, please like, share, and follow [Adil Ansari](https://linkedin.com/adilansari488) for more valuable content.
CSS CANVAS
Tags: frontendchallenge, devchallenge, css
Published: 2024-06-09 17:38:55


https://github.com/Shivaya007/css-canva.git

## Inspiration
My growing enthusiasm for web designing fuels my desire to dive deeper into this field. This passion motivates me to embrace new challenges, continually expand my knowledge, and refine my skills. I am excited to explore innovative design techniques, learn cutting-edge technologies, and create engaging, user-friendly websites. This challenge represents an opportunity for personal and professional growth, driving me to push my limits and achieve excellence in web design

## Demo 

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

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x4mjoz4y4gibebyz4jbc.png)
Cách làm bánh dẻo trung thu bằng bột nếp tại nhà
Published: 2024-06-09 17:26:56

1. Nguyên Liệu làm bánh dẻo trung thu bằng bột nếp
Nguyên liệu làm bánh dẻo trung thu bằng bột nếp
Nguyên liệu làm bánh dẻo trung thu bằng bột nếp
Nguyên liệu làm nước đường bánh dẻo

300g đường trắng (đường tinh luyện)
5ml nước cốt chanh
300ml nước
Nguyên liệu làm vỏ bánh

392ml nước đường bánh dẻo
12ml dầu ăn
6ml nước hoa bưởi
200g bột bánh dẻo Bắc (bột nếp rang)
180g đậu xanh cà vỏ
80g đường
70-80ml dầu dừa hoặc dầu ăn
9g bột mì đa dụng
270 ml nước
2. Các bước làm bánh dẻo trung thu bằng bột nếp
Bước1: Nấu nước đường bánh dẻo
Nấu nước đường bánh dẻo
Nấu nước đường bánh dẻo
Đun sôi 300ml nước, sau đó cho vào 300gr đường rồi hạ lửa nhỏ, thêm 5ml nước cốt chanh và đun thêm 15 phút, tắt bếp và lọc qua rây. Để nguội sau đó có thể đem làm bánh.

Bước2: Sên nhân đậu xanh
Đậu xanh bạn rửa sạch, ngâm cho nở, rồi vớt ra để ráo. Sau đó đun chín với 80g đường và 200 ml nước.

Sên nhân đậu xanh
Sên nhân đậu xanh
Đem phần đậu xanh đã chín xay với nước cho thật nhuyễn, lọc qua rây cho mịn rồi cho vào chảo sên. Thêm ½ lượng dầu ăn (80ml) vào khuấy liên tục trên lửa nhỏ. Tiếp tục khuấy và thêm phần dầu ăn còn lại vào.

Khi hỗn hợp đậu chuyển đặc hơn, bạn hòa tan hỗn hợp 9g bột mì với 70 ml nước rồi cho từ từ vào chảo đậu và khuấy đều tay. Sên đậu ở lửa nhỏ cho đến khi nhân khô, dẻo, không bị chảy và không dính chảo là đạt.

Đợi nhân đạt thì tắt bếp và để hơi nguội, Sau đó bạn chia nhân thành các phần bằng nhau, vo tròn nhân và bọc lại bằng màng bọc thực phẩm để tránh nhân bị khô khi làm bánh.

Bước3: Chuẩn bị vỏ bánh
Chuẩn bị vỏ bánh
Chuẩn bị vỏ bánh
Trộn đều hỗn hợp nước đường, nước hoa bưởi, rồi thêm từ từ bột bánh dẻo và khuấy nhanh tay. Tiếp đó, xoa 1 lớp bột mỏng lên bột và nhào đều tay cho đến khi bột dẻo và mịn là đạt. Sau đó, bạn dùng màng bọc thực phẩm bao lại và ủ trong vòng 30 phút.

Cuối cùng, bạn lấy bột ra nhào lại một lần nữa rồi chia bột thành các phần bằng nhau.

Bước4: Tạo hình và đóng bánh
Tạo hình và đóng bánh
Tạo hình và đóng bánh
Bước5: Thành phẩm
Bánh dẻo truyền thống với phần nhân dẻo ngọt hòa quyện cùng nhân đậu xanh bùi bùi, dùng kèm một tách trà nóng thì còn gì bằng.
Cách làm bánh dẻo trung thu bằng bột nếp tại nhà
Published: 2024-06-09 17:26:55

1. Nguyên Liệu làm bánh dẻo trung thu bằng bột nếp
Nguyên liệu làm bánh dẻo trung thu bằng bột nếp
Nguyên liệu làm bánh dẻo trung thu bằng bột nếp
Nguyên liệu làm nước đường bánh dẻo

300g đường trắng (đường tinh luyện)
5ml nước cốt chanh
300ml nước
Nguyên liệu làm vỏ bánh

392ml nước đường bánh dẻo
12ml dầu ăn
6ml nước hoa bưởi
200g bột bánh dẻo Bắc (bột nếp rang)
180g đậu xanh cà vỏ
80g đường
70-80ml dầu dừa hoặc dầu ăn
9g bột mì đa dụng
270 ml nước
2. Các bước làm bánh dẻo trung thu bằng bột nếp
Bước1: Nấu nước đường bánh dẻo
Nấu nước đường bánh dẻo
Nấu nước đường bánh dẻo
Đun sôi 300ml nước, sau đó cho vào 300gr đường rồi hạ lửa nhỏ, thêm 5ml nước cốt chanh và đun thêm 15 phút, tắt bếp và lọc qua rây. Để nguội sau đó có thể đem làm bánh.

Bước2: Sên nhân đậu xanh
Đậu xanh bạn rửa sạch, ngâm cho nở, rồi vớt ra để ráo. Sau đó đun chín với 80g đường và 200 ml nước.

Sên nhân đậu xanh
Sên nhân đậu xanh
Đem phần đậu xanh đã chín xay với nước cho thật nhuyễn, lọc qua rây cho mịn rồi cho vào chảo sên. Thêm ½ lượng dầu ăn (80ml) vào khuấy liên tục trên lửa nhỏ. Tiếp tục khuấy và thêm phần dầu ăn còn lại vào.

Khi hỗn hợp đậu chuyển đặc hơn, bạn hòa tan hỗn hợp 9g bột mì với 70 ml nước rồi cho từ từ vào chảo đậu và khuấy đều tay. Sên đậu ở lửa nhỏ cho đến khi nhân khô, dẻo, không bị chảy và không dính chảo là đạt.

Đợi nhân đạt thì tắt bếp và để hơi nguội, Sau đó bạn chia nhân thành các phần bằng nhau, vo tròn nhân và bọc lại bằng màng bọc thực phẩm để tránh nhân bị khô khi làm bánh.

Bước3: Chuẩn bị vỏ bánh
Chuẩn bị vỏ bánh
Chuẩn bị vỏ bánh
Trộn đều hỗn hợp nước đường, nước hoa bưởi, rồi thêm từ từ bột bánh dẻo và khuấy nhanh tay. Tiếp đó, xoa 1 lớp bột mỏng lên bột và nhào đều tay cho đến khi bột dẻo và mịn là đạt. Sau đó, bạn dùng màng bọc thực phẩm bao lại và ủ trong vòng 30 phút.

Cuối cùng, bạn lấy bột ra nhào lại một lần nữa rồi chia bột thành các phần bằng nhau.

Bước4: Tạo hình và đóng bánh
Tạo hình và đóng bánh
Tạo hình và đóng bánh
Bước5: Thành phẩm
Bánh dẻo truyền thống với phần nhân dẻo ngọt hòa quyện cùng nhân đậu xanh bùi bùi, dùng kèm một tách trà nóng thì còn gì bằng.
Time for A Change
Published: 2024-06-09 17:21:04

So here I am at the beginning of a new journey. I am making this post today to make my introduction and to talk about something I learned. 

I was a teacher until about two months. I have taught for more than 15 years in total and done much work in special education. I wont go on too much about it at this point however, I finally made the tough decision to leave teaching once and for all. 
Teaching has been my entire life (outside of raising my own family) for the last 15 or so years. I have tried before to make the decision to leave but I just was always to scared to leave what I knew and was comfortable with. Even after I completed my Master's in Digital Innovation in 2021, I still didn't feel confident to leave the career and to be honest I am still not 100% that I can do something else. With that being said here is what I have learned in the past month or so:
That as a teacher I have to been lead to believe that I can only be a teacher and that this is a career I should stay in no matter what. Even as I drove home after my last day of teaching thoughts of what my new career could entail crossed my mind and before I knew it I was back to thinking about teaching/education related jobs. This is not to say that those skills I will gain in the near future could not lend themselves back to an educational position however my goal is for a new career. I have learned that being "a teacher" is so ingrained in me that I even when trying to transition out it is a difficult concept to get my head around. 
I have many teacher friends and as I had given noticed that I would not return to teaching a surprising amount of my colleagues also expressed that they would like to leave but they all had the same feelings/thoughts that I had such as: What else could they do, how else could they do it, and they have been teaching for so long that leaving would be very difficult. 
I learned that teachers have been taught that this is all we can do, teach, and that leads so many of us to staying even after we are ready to move on. I learned that I have to know that this line of thinking is in fact not true and that I can transition out of that career and be successful in new profession. 
So with all that being said I am on the journey to learn about software development, UX/UI and so much more and hope that I can have the confidence to make successful career out of it in the end. 
If you have some advice to share with me as I get started I would love to hear it!
Tourney Cap
Tags: surgical, medical
Published: 2024-06-09 17:14:48

Our [surgical caps](https://tourneycap.com/product-category/surgical-caps/) are made from soft, breathable fabric that ensures comfort during long surgeries. They come in various colors and patterns, allowing medical professionals to express their personalities while maintaining a professional appearance. The caps are designed to fit securely, preventing hair from falling into the face and ensuring a hygienic working environment. They are easy to wash and maintain, making them a practical choice for daily use.
Frontend Challenge | Best Beaches in the World!
Tags: frontendchallenge, devchallenge, css
Published: 2024-06-09 17:13:22

_This is a submission for [Frontend Challenge v24.04.17](https://dev.to/challenges/frontend-2024-05-29), Glam Up My Markup : Beaches_

**🌴🏖️ Welcome to My June CSS Frontend Challenge Submission! 🌊🌅
Inspiration ✨**

## Inspiration 🤔

**Today**, I am highlighting a serene and visually appealing web page dedicated to showcasing the best beaches in the world. The design captures the tranquility and beauty of beach destinations, aiming to evoke a sense of wanderlust and relaxation. The warm colors and tropical imagery set the perfect mood for exploring _dreamy beach_ getaways. 🌞🌴

## Demo 🌐

Here's a preview of my submission:
![Gif demo of the website](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/32tix5jarxg836tpylbk.gif)

👉 You can view and interact with the full demo [here](https://hikolakita.github.io/Frontend-Challenge-Top-Beaches-/).

👉 You can also preview the full code on this [repository](https://github.com/Hikolakita/Frontend-Challenge-Top-Beaches-).

## Journey 🚀

Creating this webpage was an exciting journey that allowed me to blend aesthetics with functionality. I focused on achieving a visually pleasing gradient background to simulate a sunset, complemented by palm tree silhouettes to enhance the tropical theme. 🌇🌴 The typography was chosen to be welcoming and easy to read, emphasizing the headline and call-to-action button.

## What I Learned 📚

CSS Gradients: Crafting beautiful, smooth transitions that mimic natural light.
Layering Images with Transparency: Adding depth and dimension to the visuals.
Creating a Cohesive Color Scheme: Ensuring all elements harmonize to enhance the user experience.
I am particularly proud of how the background and text elements harmonize to create an inviting and immersive experience.

## What's Next? 🔮

Responsive Design: Refining my skills to ensure the webpage looks great on all devices.
Animations: Experimenting with subtle movements to bring the design to life.
Thank you for taking the time to check out my project! I hope it inspired a bit of wanderlust in you. 🌍✨

> "To travel is to take a journey into yourself." – Danny Kaye

Feel free to leave feedback or suggestions in the comments. Until next time, happy coding! 💻🌟

Edit : Well, I think it's responsive now :)
If it's not for you, just let me know what's your screen size and I'll fix it ;)