teleren/devto huggingface dataset:
Implementing To-Do List using JavaScript:
Tags: tech, javascript, beginners, tutorial
Published: 2023-08-01 21:01:36

Let's go through the steps of implementing a basic To-Do List with code blocks for each step:

## 1. Set Up the HTML Structure:

![html structure](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h0ky35qin9q4vc7msi5x.png)

## 2. Style the To-Do List (Optional):

![css](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/etkhrx1kyb9z9rgog1g3.png)

![css](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hitgvectaz1hbkf9vptd.png)

## 3. Handle Task Addition:

![task addition](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vx72e0pbp84yqslh2o20.png)

## 4. Display Tasks:
This step is already covered by the code in step 3.

## 5. Handle Task Completion:

![task completion](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/89ax0r7srn1cy8swyswv.png)

## 6. Handle Task Deletion:

![task deletion](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/579qoxo66h5kkdlepj6v.png)

## 7. Store Tasks in Local Storage (Optional):

![local storage](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8um3p9yckjw8tox5mlhz.png)

![local storage ](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yb7xpt70b68jpzf5pbep.png)

## 8. Refactor and Improve (Optional):
Refactor your code to make it more organized and reusable. Consider adding features like task priority, due dates, or task categories.

## 9. Test the To-Do List:
Test the To-Do List thoroughly to ensure that adding, completing, and deleting tasks work as expected. Test for edge cases and handle errors gracefully.

## 10. Deploy (Optional):
If you want to share your To-Do List with others, consider deploying it to a web hosting service or using a code sharing platform.

By following these steps and code blocks, you'll have a functional `To-Do` List application with basic task addition, completion, and deletion functionalities. Happy coding! 🚀📝
Tutorial: Enable Google Workforce SSO and MFA for Oracle PeopleSoft Via Datawiza
Tags: videos, googleworkforce, mfa, oraclepeoplesoft
Published: 2023-08-11 00:04:41

---
title: Tutorial: Enable Google Workforce SSO and MFA for Oracle PeopleSoft Via Datawiza
published: true
date: 2023-08-01 20:42:32 UTC
tags: Videos,GoogleWorkforce,MFA,OraclePeopleSoft
canonical_url: https://www.datawiza.com/videos/enable-google0workforce-sso-mfa-oracle-peoplesoft-via-datawiza/
---

<section data-id="53508cd6" data-element_type="section">
						<div>
					<div data-id="28d04ad2" data-element_type="column">
			<div>
								<div data-id="a8d50bc" data-element_type="widget" data-settings='{"youtube_url":"https:\/\/www.youtube.com\/watch?v=zhsWDDBx0qA","video_type":"youtube","controls":"yes"}' data-widget_type="video.default">
				<div>
					<div>
			<div></div> </div>
				</div>
				</div>
				<div data-id="35257522" data-element_type="widget" data-widget_type="text-editor.default">
				<div>
							<p>Setup Datawiza to enable Google Workforce SSO (Single-sign on) and MFA (Multi-factor authentication; or 2FA) for users to login to Oracle PeopleSoft! Datawiza integrates with any identity provider and MFA (2FA) service, like Microsoft Entra ID, Cisco Duo, Okta, AWS, Google, Auth0, Ping, ForgeRock, OneLogin, ADF, via OIDC (OpenID Connect) or SAML.</p>
<p>Follow these step-by-step instructions to configure Google Workforce Single Sign-on (SSO) and MFA for Oracle PeopleSoft.</p>
<p>Datawiza works with any web apps including:</p>
<p>– Business apps, like Oracle PeopleSoft, E-Business Suite, Siebel, SAP and more.</p>
<p>– Homegrown apps written in any language, like JAVA, PHP, .Net, Python, Go and more.</p>
<p>– Critical tools like WordPress, Kibana, Kubernetes, Jenkins, Grafana, SuperSet, AirFlow and more.</p> </div>
				</div>
					</div>
		</div>
							</div>
		</section><section data-id="0088ab3" data-element_type="section">
						<div>
					<div data-id="284750e" data-element_type="column">
			<div>
								<div data-id="49cefa6" data-element_type="widget" data-widget_type="button.default">
				<div>
					<div>
			<a href="https://www.youtube.com/watch?v=zhsWDDBx0qA" role="button">
						<span>
						<span>Watch video</span>
		</span>
					</a>
		</div>
				</div>
				</div>
					</div>
		</div>
							</div>
		</section>

The post [Tutorial: Enable Google Workforce SSO and MFA for Oracle PeopleSoft Via Datawiza](https://www.datawiza.com/videos/enable-google0workforce-sso-mfa-oracle-peoplesoft-via-datawiza/) first appeared on [Datawiza](https://www.datawiza.com).

The post [Tutorial: Enable Google Workforce SSO and MFA for Oracle PeopleSoft Via Datawiza](https://www.datawiza.com/videos/enable-google0workforce-sso-mfa-oracle-peoplesoft-via-datawiza/) appeared first on [Datawiza](https://www.datawiza.com).
ReactJS Coding and TechTalking, come join :D
Tags: podcast, react, frontend, javascript
Published: 2023-08-01 20:23:01

Programming a real company app with reactjs, using microfroentds and typescript C#, javascript, html, css, net core, kubernetes.

Worked for more than 6 tech companies, including AbInbev, Banco Safra e Dell Computers. For now i own a fintech and i am also building a new startup.

[Youtube stream](https://www.youtube.com/watch?v=NLRSrE7C9x0)
3000+ Follower On Dev Community Thank you All for reading My Content
Tags: webdev, programming, softwaredevelopment
Published: 2023-08-01 20:16:19

I am thrilled and honored to have garnered the attention of over 3000+ software developers on the Dev Community who have followed me to read my content. As a software developer, sharing knowledge and insights with the community has been my passion, and knowing that so many individuals find value in what I write is truly humbling. I believe in the power of collaboration and the exchange of ideas, and the Dev Community has provided an excellent platform for me to connect with like-minded professionals from around the world. I will continue to strive to produce high-quality content that adds value to the community and helps fellow developers in their journey. If you haven't yet, feel free to check out my profile on Dev Community using the following link: [](https://dev.to/sardarmudassaralikhan). Let's continue to learn, grow, and inspire each other on this exciting coding journey!
Running Real Ruby Programs Notes
Published: 2023-08-01 20:08:39

Ruby programs must be saved with `.rb`

Run ruby programs from terminal by typing `ruby program_name.rb`

Use up and down arrows to select command history and tab for autocomplete 

Use the `require` keyword to execute the contents of another file. The argument to require is the relative path in double quotes. 

A `Gem` is a library that someone shared on rubygems.org

`activesupport` is a gem that extends the built-in Ruby classes like Integer and String with handy methods like `ordinalize` and `pluralize`

Bash instal command:
`gem install activesupport`

Include at the top of the program:
`require "active_support/all"`

Bundler:
Create a file in your project called `Gemfile` (no extension)

```
# /Gemfile

source "https://rubygems.org"

gem "activesupport"
gem "awesome_print"
gem "pry-byebug"
```

Now, I can install all of the gems at once with one command:
`bundle install`

Get string:
`gets`
Pause the program and wait for the user to type something in the terminal and press return. The return value of the gets method will be a String containing what the user typed, which we can store in a variable and then process.

Interactive Ruby (IRB):
IRB is an example of a Read-Evaluate-Print-Loop (REPL)
Run at command prompt:
`irb`
Exit with `exit`

`Ctrl+C` to reset to a clean prompt.

Byebug:
When you launch irb, it doesn’t by default have any connection to any existing Ruby file.

Type `byebug` to create a breakpoint in the program 

The `(byebug)` is a prompt. This is like an irb session, but at the moment in time where the byebug appeared in the code.
You can `continue` to have it keep going with the program (until the next breakpoint).
You can also `step` to move the breakpoint forward by one line.

[Ruby Reference](https://learn.firstdraft.com/lessons/33)
🌟OpenCV🎨the Magic of Images✨Part: 1
Tags: python, github, opensource, opencv
Published: 2023-08-01 19:57:30

🎨✨ Dive into my **OpenCV GitHub repo** and witness the captivating world of Working with Images!#OpenCV #ImageProcessing #GitHubRepository🚀🌌

```
!pip install opencv-python
```
**Source GitHub:** [iam-baivab/Python/OpenCV/Working with Images](https://github.com/iam-baivab/AI-Development/blob/main/OpenCV/Working%20with%20Images)
**Example:**
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/plv7sfwbvj4pyk68v290.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/th6tqkcuf6teqphxgtbf.png)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g5e1esylcmkydpwxphgq.png)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jicxjg5gc9fxu7m4meva.png)
Building A Blog Website with Next.js
Tags: webdev, nextjs, beginners, learning
Published: 2023-08-01 19:42:01

I've always wanted a platform that truly reflects my passion for coding and writing. In the past few weeks, I started exploring Next.js and decided to build a personal blog website as a side project. In this article, I want to share my experience and a few things I learned while building this project.

If you want to see my blog in action, check it out at [www.indiecoder.tech](https://www.indiecoder.tech/).

## Simple and User-friendly Design

I went for mobile-first approach when designing my blog. I also wanted my website to feel familiar, like scrolling through a social media platform. So, I designed the navbar and homepage to look like a social media app. I also added a dark/light mode feature which is essential in modern web design.

## Content Management

I chose [Hygraph](https://hygraph.com/) for managing posts and other content on my website. It offers a GraphQL API and an intuitive UI to easily define schema and organize content. To interact with the API, I used `graphql-request` library which provides a convenient way to make GraphQL requests.

## Dynamic Routing and SSG

I learned about many powerful features of Next.js while building this app. Dynamic routing and static site generation are especially amazing. With its folder-based routing system, we don't need to set up routers manually like in a React app. For example, when I create `about/page.tsx` file inside `app/` directory, Next.js renders the page on `/about` route.

To render individual blog posts, I set up a folder like `app/posts/[slug]/page.tsx` where `[slug]` is a dynamic parameter for each post. Although Next.js can handle most of the dynamic stuff, it doesn't automatically know which routes to generate during the build time. This results in server-side rendering of the page. We can avoid this by defining `generateStaticParams` function. Here's the function I used for generating all routes for posts.

```ts
export const generateStaticParams = async () => {
  const posts = await getPosts();
  return posts.map((post) => ({ slug: post.slug }));
};
```

## Comment System

Every blog needs some social interaction, like comments and reactions. I didn't want to spend a lot of time on creating a reliable comment system. After some research, I found [Giscus](https://giscus.app/) which uses GitHub Discussions to integrate comments. It's very easy to customize and use. Just adding one component gave me a fully-functional comment system with authentication and reactions.

## Conclusion

Creating my blog website with Next.js has been an amazing experience. Although it's still basic, I feel proud of what I've built and I plan to add more features in the future. 

You can explore the source code on [GitHub](https://github.com/IndieCoderMM/indiecoder-blog). I'd love to hear your feedback and suggestions to make it even better.

Thank you for joining me on this journey, and happy coding! 😊
Story of React Native Fast Base v2!
Tags: reactnative, javascript, react, ui
Published: 2023-08-01 19:41:49


![react native fast base](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p54nsi7u9bun7rdi54sm.jpg)

⭐️ Highly customizable - Responsive UI - Dark/Light mode support ⭐️

More than two years ago, I decided to write a package and the name that came to mind was Fast Base. The purpose of the package was to help users develop their apps faster and easier, and to ensure that the components they use in their apps are efficient enough.

Recently, I decided to be more active in the open-source community, and on the other hand, I didn't achieve the goal I wanted in v1 (should add for v2 also there is a lot of room for improvement). So, in the two months that have passed, I decided to rewrite, improve, and add cool features to it, and try to maintain the project in my free time. But please don't misunderstand me! Many hands make light work! I welcome any contribution, and your help and support will help to make a better package and, as a result, will help more developers.

[Project Repo
](https://github.com/Mhp23/react-native-fast-base)

[Documentation](https://github.com/Mhp23/react-native-fast-base/blob/main/docs/USAGE.md)

**Features**

- Cross-platform (Android, iOS, and Web also support for both bare React Native and Expo)
- Easy to use
- Responsive UI
- Highly customizable
- Highly themeable
- Written by Typescript, fully typed, and extendable
- Dark/Light mode support
- Attractive components

![fast base theme](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yu5rdtsoid0skdbtyrs8.png)

Using the colors property, extend your theme for both light and dark modes, etc ([For more info click here](https://github.com/Mhp23/react-native-fast-base/blob/main/docs/USAGE.md#2--theme-system-design))

Now that I'm writing this article Fast Base has 9 components but more packages will be added.

In the end, here are awesome UI libraries for React Native like react-native-elements, native base, etc. but I suggest checking it out and might be useful for you.

Don't forget to 🌟 the project if you find it useful!

**Updated on Saturday, 20 August 2023**

The Icon component was removed in version V2 because it was being used from react-native-vector-icons, which does not support Expo by default. One of the most important goals of Fast Base is to be fully compatible with both bare React Native and Expo. I promised to add the icon to the project, but I convinced myself that it’s better for it to be an independent project. Hence, Fast Base icons are now available!

Repository: https://github.com/Mhp23/fast-base-icons

Explore available icons: https://mhp23.github.io/fast-base-icons


![Fast base icons](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/w7ddgrn6j6jpg8efi5v5.jpg)

Fast Base icons help you incorporate a modern and stylish icons from BoxIcons and Feather into your app. All icons are based on SVG and are fully supported wherever react-native-svg is supported!

**Features**

- Cross-platform
- Easy to use
- Responsive
- Customizable
- Attractive and widely used icons

Good Luck!
TIL Ruby Conditions
Tags: beginners, programming, ruby
Published: 2023-08-01 19:31:58

Conditionals are an important part of the logic in any programming language.  Here are the conditionals I've learned about relating to Ruby

## if/elsif/else

The `if` conditionals are probably some of the most common conditionals in programming, and of course Ruby utilizes them as well.

```ruby
x = [0, 1, 2].sample
if x == 0
   puts "X is zero!
elsif x == 2
   puts "X is two!"
else 
   puts "X is one!"
end
```

As you can see, it is pretty straight forward.  The code under the `if` statement runs if the condition is true; if it is not true then it will attempt to run `elsif` (as many as there are, in order), before finally running `else`

## unless

`unless` is a statement that is not seen in many other programming language.  Logically, it is the same as `if not` 

```ruby
x = [0, 1, 2].sample

# both of these conditional statements operate the same:

unless x == 2:
   puts "X is not 2"
else 
   puts "X is 2"
end

if x != 2:
   puts "X is not 2"
else
   puts "X is 2"
end
```

Things to keep of note: `elsif` does not work with `unless`, and there is also not any form of `elsunless` either, so you cannot build logic statements with as many branches with an `unless` statement.

Also, `else` statements can occasionally seem odd to read with `unless`

Whether or not one uses `if not` or `unless` is largely a matter of personal preference, but the limitations and readability concerns above may guide a developer to choosing one over the other.

## case when

`case` statements are similar to `switch` statements in other languages.  These are conditionals that support multiple paths and various different types of input, and utilize an implicit `===` operator

```ruby
x = [1, "2", 3, "4", 5, "6", 7, :rabbit].sample
case x
when 1 # 1 === x
   puts "X is 1"
when "2" # "2" === x
   puts "X is a string of '2'"
when 5...9 # 5...9 === x
   puts "X is an integer in the range of 5 and 9"
when "5"..."9" # "5"..."9" === x
   puts "X is a string in the range of '5' and '9'"
when Integer # Integer === x
   puts "X is an integer not accounted for"
when String # String === X
   puts "X is a string not accounted for"
when Symbol # Symbol === x
   puts "X is a symbol"
end
```
Notice two things above.  
First, in the comments, the placement of elements around the `===` operator.  The order is important, the item on the left will be compared to the item on the right.  `String === x` is not the same as `x === String`
Second, notice how the `===` operator allows us to compare items more broadly, instead of having to call x.class.  I will make a future post on the `===` operator on a later date, but, for now, it is worth it to mention that it allows very powerful comparisons.

I believe that `case` statements are very important tools for developers to use when dealing with more complex logic blocks.
CoyAmore - Sustain energy, match comfortably
Tags: dating
Published: 2023-08-01 19:29:27

CoyAmore is an innovative dating app specifically designed for introverts, providing a comfortable and inclusive platform for individuals who prefer a more introverted approach to dating. Our mission is to create meaningful connections while respecting and embracing the unique qualities of introverted individuals.

At the heart of CoyAmore lies a sophisticated matching algorithm, meticulously crafted based on the renowned concept of the five universal love languages. By incorporating these love languages into our algorithm, we ensure that our users find compatible matches who understand and appreciate their emotional needs and communication styles. Whether it's words of affirmation, acts of service, receiving gifts, quality time, or physical contact, CoyAmore's algorithm considers these aspects to foster deep and meaningful connections.

Understanding the anxieties and concerns that can accompany dating, especially for introverts, CoyAmore offers a variety of features tailored to address these specific needs. One such feature is our unique blind date option, which allows users to ask each other without fear of directly initiating themselves. This way, introverted individuals can explore potential connections at their own pace, building comfort and confidence before taking the next step.

Additionally, CoyAmore goes beyond being just a dating app. We aim to foster a supportive community for introverts, providing a space where they can connect with like-minded individuals and share experiences.

[https://www.coyamore.com](https://www.coyamore.com)
The Art Of Messy Code - Chapter 1: Don't Think: The Best Solution For Software Development - Preface
Tags: productivity, learning, management, programming
Published: 2023-08-01 19:25:00

## Preface - Chapter 1

Within the intricate labyrinth of software development lies an unconventional artistry, uncharted and intriguing, where the interplay of order and chaos gives rise to a distinctive approach known as "The Art of Messy Code." The following pages embark on an illuminating expedition that defies conventional norms, embracing the essence of a playwright's fervor, an artist's imagination, and the daring spirit of a freestyle software engineer.

This book serves as a tribute to the pioneers of programming—audacious souls who reject the trodden paths and forge their own, embracing the messiness and unpredictability of the creative process. Guided by a master of character-driven coding, we embark on a journey into an entirely distinct dimension of software development.

Chapter 1: "Don't Think: The Best Solution For Software Development" exhorts us to relinquish our preconceived notions of order and linear thinking, which have long held dominion in the realm of software engineering. Instead, we are beckoned to explore the enigmatic realm of spontaneous creation, where code unfurls organically, akin to a captivating narrative penned by a playwright's quill. The pursuit of unbridled innovation through an unhindered mind supersedes strict adherence to protocols or dogmatic quests for perfection.

Each page invites us to glimpse an alternate perspective—a fresco of unorthodox ideas, ingenious workarounds, and unabashedly messy solutions, challenging the established norms. With each venture into the depths, we discern an intriguing form of order—a symphony of intricately woven characters that breathe life into the code.

Yet, caution is warranted, as this journey demands audacity. One must embrace the unexpected, release inhibitions, and discover artistry in every keystroke. The playwright, artist, and freestyle software engineer summon us to unshackle our creativity and explore untrodden recesses of coding prowess.

Dear reader, if you dare to tread this extraordinary path and immerse yourself in the captivating fusion of creativity and code, then venture forth and permit "The Art of Messy Code" to ignite the fire within. Embrace the chaos, for within that cauldron of artistic fervor, the true essence of software development reveals itself.

May this book inspire you to unleash the inner artist, pioneering a new era of character-driven coding. Welcome to a realm where messiness is not only accepted but celebrated—a world where the unconventional becomes the norm, and brilliance thrives amidst apparent disorder.

The journey commences.

Yours sincerely,

{% embed https://dev.to/darkterminal %}
Creating 5x20 grid using Flex(css)
Tags: css, jquery
Published: 2023-08-01 19:19:10

```html
<html>
  <body>
    <div class="container">
    </div>
  </body>
</html>
```

```css
.container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.container .entry {
    padding: 0; 
    margin: 5px; 
    width: 10%; /*to be responsive*/
    height: 20px; 
    border: 1px solid black;
    text-align: center; 
    line-height: 20px;
}
```

```javascript
function createDivs(count,itemsInaRow) {
  for(let i=1;i<=count/itemsInaRow;i++){
          const container = $("<div>").addClass("container");
          //each container contain five entry
          for (let j = 1; j <= itemsInaRow; j++) {
              const div = $("<div>").addClass("entry").text("");
              container.append(div);
          }
          $("body").append(container);
      }
   //after creating 5x20 grid, set the values
    $(".entry").each(function(index,obj){
      $(this).text(String(index+1).padStart(3, '0'));
    });
}

createDivs(100,5);
```

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