teleren/devto huggingface dataset:
Exploring Angular with GitHub Repositories: Top Picks for Learning and Development
Tags: angular, github
Published: 2022-12-15 14:25:31

## Awesome Angular -

📄 A curated list of awesome Angular resources

![img-1](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5p3vems7ugtldgqu59gs.png)

[https://github.com/PatrickJS/awesome-angular](https://github.com/PatrickJS/awesome-angular)

## Angular Jumpstart -

Angular and TypeScript JumpStart example application

![img-2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qihawkltdcmty5cy8uw8.png)

[https://github.com/DanWahlin/Angular-JumpStart](https://github.com/DanWahlin/Angular-JumpStart)

## Angular Interview Questions -

List of 300 Angular Interview Questions and answers

![img-3](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uh1qxwprhww4jpacezpg.png)

[https://github.com/sudheerj/angular-interview-questions](https://github.com/sudheerj/angular-interview-questions)
The Well Architected Framework
Published: 2022-12-15 14:17:31

The Well Architected Framework is a set of guidelines and best practices for building good cloud computing applications.

It can help you make sure your applications are reliable, secure, efficient, and cost-effective. Some of the benefits of using the Well Architected Framework include:

- Better performance: The framework can help you design your applications so they run faster and more smoothly.

- Improved security: The framework includes guidelines for protecting your applications from cyber threats and unauthorized access.

- Reduced costs: The framework can help you save money by making sure you only use the resources you need, and by helping you avoid costly mistakes.

- Greater scalability: The framework can help you design your applications so they can easily handle increases in traffic or data without breaking.

Overall, the Well Architected Framework is a helpful tool for anyone who wants to build high-quality, successful cloud computing applications.

Do you want to learn more about it?  
https://learn.microsoft.com/en-us/azure/architecture/framework/


#azure #microsoft #cloud #cloudcomputing #wellArchitectedFramework
If we create a responsive web application with HTML5 & CSS3 why do we still need JavaScript?
Tags: webdev, javascript, beginners, programming
Published: 2022-12-15 14:15:32



Olayemi .O Ogunrinde
If we create a responsive web application with HTML5 & CSS3 why do we still need JavaScript?
While HTML and CSS are great for creating the structure and style of a web page, they don't provide the functionality needed to create a truly interactive and responsive experience. This is where JavaScript comes in. JavaScript allows you to create dynamic content, control multimedia, animate images, and much more. It is an essential part of creating modern web applications.

JavaScript can also be used to communicate with the server, allowing you to update the content of your web page without needing to refresh the whole page. This can make your web application faster and more responsive. Additionally, JavaScript can be used to enable features such as offline support and geolocation, which are not possible with just HTML and CSS.

In short, while HTML and CSS are important for creating the structure and style of a web page, JavaScript is essential for adding interactivity and functionality to your web application.
Responsive Registration Form in HTML and CSS
Tags: html, css, tutorial
Published: 2022-12-15 13:57:14

today we are going to learn How to create a responsive registration form in HTML and CSS, It's a fully responsive registration form. I've used HTML and CSS to design it, if you are a beginner It's the best simple project for you.

You will learn many new things from this video, hope this video tutorial is helpful and beneficial for you.

{% embed https://www.youtube.com/watch?v=dJ2xPYHiBHM %}.
Check Out These New Gobrake Framework Packages
Tags: news, go
Published: 2022-12-15 13:55:07

Recently, Golang released their “[Go Developer Survey 2022 Q2 Results](https://go.dev/blog/survey2022-q2-results)” showing some essential insights about Go. One insight in particular caught our eye: around 11% of [Golang users struggle with error handling](https://blog.airbrake.io/blog/golang/golang-error-handling-basics) and working with stack traces, ranking it as their biggest challenge that they personally face using Go today. If you happen to be one of those developers, don’t worry, because Airbrake has your back! 

Over the last few months, we’ve been hard at work updating our Gobrake packages and, now, we’re happy to announce several new Go frameworks that we support! 

You can use [Airbrake Error Monitoring](https://www.airbrake.io/error-monitoring) right out of the box with the following Go frameworks:

[Beego](https://docs.airbrake.io/docs/platforms/framework/go/beego/)

[Buffalo](https://docs.airbrake.io/docs/platforms/framework/go/buffalo/)

[Echo](https://docs.airbrake.io/docs/platforms/framework/go/echo/)

[FastHttp](https://docs.airbrake.io/docs/platforms/framework/go/fasthttp/)

[Fiber](https://docs.airbrake.io/docs/platforms/framework/go/fiber/)

[Gin](https://docs.airbrake.io/docs/platforms/framework/go/gin/)

[Gorilla/Mux](https://docs.airbrake.io/docs/platforms/framework/go/gorilla/)

[Iris](https://docs.airbrake.io/docs/platforms/framework/go/iris/)

For additional information, head on over to our [Go docs page](https://docs.airbrake.io/docs/platforms/go-lang/). There, you’ll find more  information on how to install the Gobrake package for any application using these frameworks.

Airbrake is always making updates and improvements to our software. So, don’t forget to follow Airbrake either on [Twitter](https://twitter.com/airbrake), [LinkedIn](https://www.linkedin.com/company/airbrake-io), and/or [Facebook](https://www.facebook.com/airbrake.io/). We also have the [Airbrake Dev Community Discord](https://bit.ly/Airbrake-Discord) that anyone can join! Our discord community features Airbrake announcements, office hours, programming help, and more!
How to create a React app for a complete Beginner
Tags: react, webdev, javascript, beginners
Published: 2022-12-15 13:53:07

To create a React app as a complete beginner, you will need to have Node.js and npm (the Node.js package manager) installed on your computer. Once you have these prerequisites installed, follow these steps:

1. Open a terminal or command prompt and navigate to the directory where you want to create your React app.

2. Run the following command to create a new React app:

```
npx create-react-app my-app
```
This will create a new directory called "my-app" with the necessary files for a basic React app.

3. Navigate into the new "my-app" directory and start the development server by running the following command:

```
cd my-app
npm start
```
This will start the development server and automatically open your default browser to http://localhost:3000/. You should see a "Welcome to React" message on the page.
4. To edit your React app, open the "my-app" directory in a code editor of your choice. You can make changes to the code and the development server will automatically reload the page to reflect your changes.

5. When you are ready to build your app for production, run the following command:
`npm run build
`
This will create a "build" directory with optimized versions of your app's files. You can deploy these files to a web server to make your app available to the public.

Congratulations, you have created your first React app! To learn more about React and how to build more complex applications, check out the official React documentation and tutorials.
Best Coding Practices
Tags: beginners, codenewbie, programming
Published: 2022-12-15 13:47:22

Writing clean, readable code is an important skill for any developer. Not only does it make your code easier to understand and maintain, but it also helps to prevent bugs and errors. In this blog, we will discuss some best practices for writing clean code.

1. Use meaningful names for variables, functions, and other elements of your code. This will make it easier for others (or future you!) to understand what your code is doing.

2. Use white space and indentation to organize your code and make it more readable. This can include adding blank lines between code blocks, indenting nested code blocks, and aligning code on the same line.

3. Write modular code by breaking your code into small, reusable functions. This will make your code more organized and easier to read, as well as allowing you to reuse the same code in multiple places.

4. Use comments to explain your code, especially for complex or non-obvious sections. This will help others understand what your code is doing and why.

5. Follow the style guide for the language you are using. Different programming languages have their own conventions for formatting and organizing code, and following the style guide will make your code more consistent and easier to read.

By following these best practices, you can write clean, readable code that is easy to understand and maintain. This will make your code more efficient, reliable, and scalable, and will help you to become a better developer overall.
undefined
Published: 2022-12-15 13:18:59

<p>undefined</p><p>This article is published w/ <a href="https://scattr.io?ref=medium&source=undefined">Scattr ↗️</a></p><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=f7c9d51269af" width="1" height="1" alt=""></br><p style="color:#757CF9;">This article is published w/ <a target="_blank" href="https://scattr.io?ref=dev&source=undefined">Scattr  ↗️</a></p>
Push Markdown Note File like Obsidian to GitHub using Cronie
Tags: linux, github
Published: 2022-12-15 13:07:39

I wanted to push my markdown files to github automatically and I solved it with a cron job.

first, I commit my markdown directory and pushed it to github manually, next I created a script to push it automatically. [script](https://gist.github.com/bukanspot/2677e31f17a20fb11241ae583798bfb0)
```
#!/usr/bin/env sh

pusher-obsidian=/home/spot/spotspace/pusher-obsidian

cd $pusher-obsidian

git pull origin main -q

result=$(git status --porcelain | wc -l)

if [[ $result -eq 0 ]] ; then
        exit 0

fi
        git add .; git commit -q -m "$(date +"%c")"; git push origin main -q
```

I use a cron job to run script
```
crontab -e
```

and put this
```
@reboot /bin/sleep 120 ;  <script_directory>
```

---
### reference
- [ostechnix.com](https://ostechnix.com/a-beginners-guide-to-cron-jobs/)
Intermittent build failures on react native android due to jcenter
Published: 2022-12-03 17:26:02

---
title: Intermittent build failures on react native android due to jcenter
published: true
date: 2022-12-15 13:00:00 UTC
tags: 
canonical_url: https://friendlyuser.github.io/posts/tech/jcenter_crashing_react_native_app/
---


The first article at [bintray removed](https://friendlyuser.github.io/posts/bintray_removed_approaches/) is a good starting point for migrating from jcenter to mavenCentral.


Following instructions from patch-package I am able to commit changes that replace references to jcenter in react-native node_modules with mavenCentral.

After updating the file, and hitting save, run patch command to create a patch file:


For example to update `@react-native-community/geolocation` you would run the following command:

```bash
npx patch-package @react-native-community/geolocation
```
```git

diff --git a/node_modules/lottie-react-native/build.gradle b/node_modules/lottie-react-native/build.gradle
index 184fdbf..2599f31 100644
--- a/node_modules/lottie-react-native/build.gradle
+++ b/node_modules/lottie-react-native/build.gradle
@@ -3,7 +3,7 @@
 buildscript {
   repositories {
     google()
-    jcenter()
+    mavenCentral()
   }
   dependencies {
     classpath 'com.android.tools.build:gradle:7.0.0'
@@ -14,7 +14,7 @@ allprojects {
   repositories {
     mavenLocal()
     google()
-    jcenter()
+    mavenCentral()
     maven {
       // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
       url("$rootDir/node_modules/react-native/android")
```

Overall going through the process of migrating from jcenter to mavenCentral is not too bad, but it is a bit tedious.

A simple approach is to search for files in node_modules that reference jcenter and replace them with mavenCentral. You can ignore dependencies of dependencies, since they will be updated when you update the dependency.

At first I thought I could ignore patch package as a dependency and set as a dev dependency but it needs to be installed it order to apply the patches.

With the increasing unreliablility of jcenter, you may see more and more react-native projects using patch-package to migrate from jcenter to mavenCentral for android.

You can never know when it will go down for good or if there will be an outage, for more reliable service you should migrate to mavenCentral as soon as possible.

Thats why I believe all ci jobs should happen automatically from month to month just to ensure nothing breaks.

### References

- https://jfrog.com/into-the-sunset-bintray-jcenter-gocenter-and-chartcenter/
- https://blog.gradle.org/jcenter-shutdown
- https://www.reddit.com/r/reactnative/comments/s5ctrc/is_jcenter_again_down/
- https://www.reddit.com/r/androiddev/comments/lbssfn/now_that_bintray_and_jcenter_are_shutting_down/
- https://www.reddit.com/r/java/comments/shfuz2/friendly_reminder_get_ride_of_any_jcenter/
How to deploy a website using serverless architecture?
Tags: webdev, serverless, aws, programming
Published: 2022-12-15 12:56:33

How to deploy a website with AWS S3 + CloudFront using CloudFormation?

After making the backend serverless, it’s time for the frontend to go serverless.

So, why do we go serverless or say what are the benefits?

- Get rid of server management and code deployment stuff
- Pay for what you use
- Infinite scaling

This article will show you how to deploy a website using `AWS S3`, `CloudFront`, and `CloudFormation`.

## Table of contents

1. Add IAM permissions
2. Create an S3 bucket and upload the code
3. Create OriginAccessControl(OAC)
4. Configure CloudFront
5. Update the S3 bucket policy
6. Point the domain to CloudFront
7. FAQs

For detailed implementation, [check out our blog.](https://blog.canopas.com/deploy-a-website-with-aws-s3-cloudfront-using-cloudformation-c2199dc6c435)
Lifelong learning project for devs...
Tags: beginners, tutorial, opensource, resource
Published: 2022-12-15 12:51:51

I wished there was a place I can find out what I learned as a dev.

So, I'm starting a new project [Things I wish I had](https://github.com/bitethecode/things-I-wish-I-had) for any devs.

This will contain the core concepts of following categories and tips.
- vim
- docker 
- kubernetes
- git
- shell 

And more..! 
Star [Things I wish I had](https://github.com/bitethecode/things-I-wish-I-had) for any updates!
XML JOB INTERVIEW QUESTIONS
Tags: xml, xmlinterview, interviewquestions, xmlinterviewquestions
Published: 2022-12-15 12:47:52

Practice here the most popular [XML Interview Questions and Answers](https://www.onlineinterviewquestions.com/xml-interview-questions/)

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

1. - Define What is XML?
2. - List some features of XML?
3. - What is XML Schema?
4. - State some benefits of XML?
5. - What is XML Signature?
6. - Define the three parts of XSL?
7. - Is it possible to use graphics in XML?
8. - List some disadvantages of XML?
9. - Define the basic XML rules?
10. - What is a well-formed XML document?
11. - Why has XML been used for development?
12. - Why should we go for XML editor instead of Notepad?
13. - Define Complex Element?
14. - What are the types of XML Parsers?
15. - Define XLink and XPointer?
16. - What do you mean by nested elements in XML?
17. - Is there any way that HTML can be replaced with XML?
18. - Define SGML?
19. - Define XSL?
20. - Define CDATA?

_Thanks for Reading here._
Layouts with Tailwindcss
Tags: webdev, beginners, tailwindcss, programming
Published: 2022-12-15 12:46:28

{% embed https://www.youtube.com/watch?v=P1k4kwV4VXQ %}

Tailwind CSS is a CSS framework that provides a set of utility classes that you can use to build responsive, flexible layouts. The three main types of layouts you can create with Tailwind CSS are:

1. Flexbox layout: This type of layout is based on the CSS Flexible Box Layout Module, and it allows you to create flexible, responsive containers and items that can be easily aligned and distributed within a container.
2. Grid layout: This type of layout is based on the CSS Grid Layout Module, and it allows you to create complex, responsive grids with rows and columns. You can easily control the size, position, and spacing of grid items, and create responsive layouts that adapt to different screen sizes.
3. Float layout: This type of layout uses the CSS float property to position elements within a container. It's a simple and easy-to-use method for creating basic layouts, but it can be less flexible and less predictable than Flexbox and Grid layouts.

In general, Tailwind CSS makes it easy to create responsive, flexible layouts without having to write a lot of custom CSS. Its utility classes provide a convenient, low-level API that lets you quickly and easily control the layout of your elements, and its built-in responsive design features make it easy to create layouts that look great on any device.

Guillaume Duhan
Planet Crust released Corteza 2022.9.3 💻🎉
Tags: release, update, lowcode, opensource
Published: 2022-12-15 12:37:10



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

Planet Crust, the driving force behind the Corteza open-source low-code development platform, has released a new update of Corteza. Check out the new features, changes and fixes: https://www.planetcrust.com/planet-crust-releases-corteza-2022-9-3
Getting Started with Node.js, Express.js, and GraphQL: A Beginner's Example Project
Tags: node, expres, graphql
Published: 2022-12-15 12:32:50

Create a directory and make that your working directory.

```jsx
mkdir example-app
cd example-app
```

Use `npm init` to create `packge.json` in your application

```jsx
npm init

or

npm init -y
```

Fist install `express`using `npm install`

```jsx
npm i express
```

Next create `index.js` file

```jsx
const express = require('express')
const app = express()
const port = 3000

app.get('/', (req, res) => {
  res.send('Hello World!')
})

app.listen(port, () => {
  console.log(`Example app listening on port ${port}`);
})
```

Now run the project

```jsx
node index.js
```

Output will get : `Example app listening on port 3000`

Then, load `http://localhost:3000/`in a browser to see the output.

Now will serve static files in project by creating `public` folder and adding `index.html` in it.

Next updating index file with below code.

```jsx
...

const path = require('path')
app.use('/', express.static(path.join(__dirname, 'public')))

...
```

Next add `express-graphpql`, and `graphql`using `npm install` in the project

```jsx
npm i express-graphpql graphql
```

Now update index.js with following

```jsx
...

const { graphqlHTTP } = require('express-graphql');
const { buildSchema } = require('graphql');

// Construct a schema, using GraphQL schema language
const schema = buildSchema(`
  type Query {
    hello: String
  }
`);

// The root provides a resolver function for each API endpoint
const root = {
  hello: () => {
    return 'Hello world!';
  },
};

...

app.use('/graphql', graphqlHTTP({
    schema: schema,
    rootValue: root,
    graphiql: true,
  }));

....
```

Here is the final index.js file with complete code

```jsx
const express = require('express')
const app = express()
const port = 3000

const { graphqlHTTP } = require('express-graphql');
const { buildSchema } = require('graphql');

// Construct a schema, using GraphQL schema language
const schema = buildSchema(`
  type Query {
    hello: String
  }
`);

// The root provides a resolver function for each API endpoint
const root = {
  hello: () => {
    return 'Hello world!';
  },
};

const path = require('path')
app.use('/', express.static(path.join(__dirname, 'public')))

app.get('/', (req, res) => {
  res.send('Hello World!')
})

app.use('/graphql', graphqlHTTP({
    schema: schema,
    rootValue: root,
    graphiql: true,
  }));

app.listen(port, () => {
  console.log(`Example app listening on port ${port} and GraphQL server listening on port ${port}/graphql`);
})
```

Now run the project and you will see output : Example app listening on port 3000 and GraphQL server listening on port 3000/graphql

Then load `http://localhost:3000/graphql` in a browser to see the output.

![img-preview](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9xcxkvhi730l0g6h91rc.png)

Complete code available here - [https://github.com/manthanank/graphql-nodejs-expressjs](https://github.com/manthanank/graphql-nodejs-expressjs)
Fake Data Generator For MySQL
Tags: python, mysql, datascience, dummydata
Published: 2022-12-15 11:21:26

What Is Fake Data ?
Fake data is a term used to describe information generated for testing or demonstrating a computer system. In the context of a MySQL database, fake data refers to creating fictional records that can be used to populate a database table for testing or experimentation.

Fake data can be helpful in several ways. For example, it can be used to test the performance of a database system under a variety of conditions or to demonstrate the capabilities of a particular database application. It can also be used to provide examples of how a database might be structured and used without having to rely on real-world data that may be difficult or impossible to obtain.

There are several different techniques that can be used to generate fake data for a MySQL database. One common approach is using a tool specifically designed for this purpose, such as a data generation tool or a random data generator. These tools allow users to specify the types of data that should be generated, as well as the number of records that should be created.

Another approach is to use a script or program to generate fake data on the fly. For example, a script could be written in a programming language such as PHP or Python that creates records in a MySQL database according to a set of rules or algorithms. This approach allows for greater control over the types of data that are generated, as well as the ability to customize the data to meet specific testing or demonstration needs.

Regardless of the approach used, the goal of generating fake data for a MySQL database is typically to create records that are as realistic as possible while still being distinct from real-world data. This can involve using names, addresses, and other information similar to real-world data but not associated with any real individuals or organizations.

The use of fake data in a MySQL database can be a valuable tool for testing, demonstration, and experimentation. By providing a set of fictional records that can be used in place of real-world data, fake data can help ensure that a database system is functioning correctly and can provide valuable insights into how a database can be used in various contexts.

How To Generate Fake Data Using Python Facker Library For MySQL Database
from faker import Faker
import mysql.connector
n = 1000
# create a new Faker instance
fake = Faker()

# create a connection to the MySQL database
cnx = mysql.connector.connect(user='root', password='oracle',port=3308,
                              host='192.168.1.5', database='testdb01')
cursor = cnx.cursor()

Read more: https://thedbadmin.com/fake-data-generator-for-mysql/