teleren/devto huggingface dataset:
Automating CraftCMS Database Backups on Platform.sh
Tags: database, craftcms, platformsh, devops
Published: 2021-04-02 13:10:05

Congrats, you just released your very first CraftCMS site. Great! You're done! 

Wait... you forgot to setup backups! Of course, some hosting providers take their own database snapshots; but often they are inaccessible except in case of catastrophic issues. What if you just want to jump back a day or week and know what's going on. 

Well fortunately for us, it's not difficult to setup database backups on our own. 

--

To setup backups there are three things you'll need: 1) Some type of CRON system; 2) A computing server that will run shell scripts; 3) A storage location. 

In my case I'm going to use Rundeck for CRON, a standard Linux server for compute, and Amazon S3 for storage. You can adapt from there, however. 

## Storage Location

We're going to start at the end and work backwards here. If you're using S3, jump into the AWS Console and create a new bucket for CraftCMS backups. 

Be sure to keep it as a private bucket or else anyone could access your database backups of potentially private information. 

You may [also want to enable Glacier](https://aws.amazon.com/blogs/aws/archive-s3-to-glacier/) as well to limit your costs. I typically push backups to glacier after a week. 

## Compute Server

Now let's write your script! [I've posted mine here](https://gist.github.com/mattbloomfield/2162d281063a72afa2942e35e88f04a6) for you to copy if you'd like. The main point here is to SSH into the location and export the database, save it locally, then push it to S3. 

If you're using my script - you'll need to update some variables to work for you. 

This script leverages the [AWS CLI](https://docs.aws.amazon.com/cli/latest/userguide/install-cliv2-linux.html), which greatly simplifies this process. You could do this via API as well, but if you can use the CLI I highly recommend it. You could also store your backups on a mounted network drive wherever your compute server lives as well. 

The SSH User & Host will be easy to find in the Platform.sh GUI. Once you SSH in you can `echo $PLATFORM_RELATIONSHIPS | base64 --decode | json_pp` to see your database credentials. 

## CRON Setup

Finally, let's trigger the backups at the frequency you choose. I would recommend once a day as a default, increasing or decreasing depending on publication frequency. 

In my case [I used Rundeck](https://docs.rundeck.com/docs/manual/03-getting-started.html) because I already use it for heaps of other things. However, if you don't have Rundeck installed you could [just use the crontab](https://opensource.com/article/17/11/how-use-cron-linux). Either way, just set it up to hit your backup shell script: 

```bash
## In crontab, each night at midnight: 
0 0 * * * sh /var/scripts/craft_backups/my_script.sh
```

---

And that's it! You've got stable backups stored in S3 for easy access anytime you need.
Creating a Toggle button in React
Tags: react, webdev, javascript, codenewbie
Published: 2021-04-02 13:09:22

Lately I was working on a problem where I had to toggle something in React JS and I couldn't find a simple 1-2 liner solution for that, like we have in Jquery. If you have ever used it, you probably know what I am talking about.

> Note: I am not trying to compare `Jquery` and `React` here. They both serve their purpose very well.

Let's take an example. We will create a button that changes the text from `Off` to `On` and vice-versa with one click of a button.

Let's talk through this example step by step:

1. Create a button - we will use material-UI for that.
2. Create a state that will hold the `On/Off` value.
3. Show `On/Off` text once user clicks the button. 
4. If the text says `On` and user clicks the button, it should   change the text to `Off` and vice-versa.

*  **Step 1**: Create a button

```
<Button variant="contained" color="primary">
    Toggle
</Button>
```

* **Step 2**: Create a state that will hold value `On/Off`:
```
const [textState, setTextState] = useState("off");
```

We are taking `Off` as initial state to avoid any kind of code smell.

* **Step 3**: Show `On/Off` text on click of the button.

This part involves two small but important steps:
1. A text that changes with the click of the button
2. A function to handle the toggle when user clicks on the button

So, let's pass the text first, `buttonState` will give us `Off` by default as it is our initial state:
```
 <h3>{textState}</h3>
```

Add the Handler function:

```
const toggleText = () => {
    setTextState((state) => (state === "On" ? "Off" : "On"));
};
```
We are updating the state  of the button here. If it is `On`, change it to `Off` and if it is `Off`, change it to `On`. 

* **Step 4**: Toggle, to achieve this we only need to pass our handler function to the `onClick` of `<Button>` from step 1. Like this:

```
<Button variant="contained" color="primary" onClick={toggleText}>
    Toggle
</Button>
```

And that's all! Here is how it looks when we put all the above code together: 

{% codesandbox u74p9 view=split %}
CPP Pointers Doubt !!!
Published: 2021-04-02 12:57:10

Can some please explain this please
int x=100;
int *ptr;
*ptr=x;
cout<<&x;//Gives address of x;
cout<<&ptr;//Gives address of ptr;
cout<< ptr;//Giving a random address somehow don't know 

my doubt is :

whose address is this(ptr), 
where & how did my program get hold of this address, 
Is this a mistake, bug or a new feature,
Did this break any program,
Is this recommended,
Is this a good practice?;

And How come *ptr var is storing a value of var(x) instead of its address and why is this not an error?
Python Training Center in Bangalore
Tags: python
Published: 2021-04-02 12:55:31

TIB Academy-Software Training institute is the right place to head start your career in Python Training Center in Bangalore. We provide the Best Python Training with 100% Placement Support. Call now to book your free demo class. Contact us: +91 9513332301
Website: https://bit.ly/3s3XyKb 
#education  #ITtraininginstitute  #traininginbangalore  #TIBAcademy
Get started with Web Development, HTML Part-1
Tags: beginners, html, webdev, tutorial
Published: 2021-04-02 12:54:04

---
canonical_url: https://alitahashakir.dev/get-started-with-web-development-html-part-1/
---

Hello everyone. The aim of this article is to provide basic HTML knowledge and get you familiar with common tags and statements which you need to get started with your first HTML page.


##DOCTYPE

Document type declaration also known as `DOCTYPE` informs the browser about markup language in which the current page is written in. 

It is the first line in every HTML page and is written as:
```html
<!DOCTYPE html>
```

##html

Truth be told, I don’t know exactly why the `<html>` tag is used. But I know it is a common practice to use it as a wrapper for all your other tags except `DOCTYPE`.

You should also include `lang` attribute in your `<html>` tag to declare language of web page and to assist search engines and browsers

```html
<!DOCTYPE html>
<html lang="en">

</html>
```

##head

`<head>` section contains the information about the page which is readable by browsers, search engines, and other sites.

Some common things which are included in `<head>` are:

* Meta tags (useful to search engines)
* Title tag (page title, shows up in your browser tab)
* Link tag (use to link your CSS files in HTML page)
* Script tag (use to link you JavaScript file in you HTML page)
```html
<!DOCTYPE html>
<html lang="en">
	<head>
		<meta property="og:title" content="Example page title." />
		<meta property="og:description" content="Example page description." />
		<meta property="og:image" content="url to your image" />

		<title>Page title</title>
	</head>
</html>

```

##body
Everything which is visible on your page comes inside the `<body>` tag. Most of the tags which we will go through are used in `<body>` tag
```html
<!DOCTYPE html>
<html lang="en">
	<head>
		<meta property="og:title" content="Example page title." />
		<meta property="og:description" content="Example page description." />
		<meta property="og:image" content="url to your image" />

		<title>Page title</title>
	</head>

	<body>
		<!-- page content comes here -->
	</body>
</html>
```

#Conclusion

We went through basic HTML tags which occur on almost all HTML pages and made a skeleton boilerplate for our HTML file. In the next article of this series we will go through the tags which are used in `<body>` tag and are used to layout your page.

**Thanks for Reading.**

If you enjoyed this post please share, and follow me on [DEV.to](https://dev.to/alitahashakir) or [Twitter](https://twitter.com/AliTahaShakir) if you would like to know as soon as I publish a post! 🔥
Free JavaScript roadmap for learning the fundamentals
Published: 2021-04-02 12:47:59

_If you found value in this thread you will most likely enjoy my tweets too so make sure you follow me on [Twitter](https://twitter.com/VladPasca5)  for more information about web development and how to improve as a developer. This article was first published on my [Blog](https://vladpasca.hashnode.dev/)_

-  [Variables (var, let and const)](symbolhttps://scotch.io/courses/10-need-to-know-javascript-concepts/declaring-javascript-variables-var-let-and-const) 

-  [Data types](symbolhttps://digitalocean.com/community/tutorials/understanding-data-types-in-javascript) 

-  [Alert, prompt and confirm](symbolhttps://javascript.info/alert-prompt-confirm) 

-  [Basic operators, maths](symbolhttps://javascript.info/alert-prompt-confirm)

-  [Comparisons](https://t.co/lYH2SoIiUl?am)

-  [Logical operators](https://t.co/HU5HVtPTUU?amp=1) 

-  [The switch statement](https://t.co/23LNaijaUS?amp=1) 

-  [Arrays](https://t.co/dIo6rDjMGd?amp=1) 

-  [Array methods](https://t.co/bhPix4s8OS?amp=1) 

-   [Flow control](https://t.co/TRUBl7p1jP?amp=1) 

-  [Loops](https://t.co/q4miz9qO4r?amp=1) 

-  [Objects and Classes](https://t.co/xNe7DYu4SW?amp=1) 

-  [Functions](https://t.co/jbOrLgDh1b?amp=1) 

-  [Arrow functions](https://t.co/QeP4Xm2gMR?amp=1) 

-  [The DOM](https://t.co/ty6o0NM54R?amp=1) 

-  [Prototypes](https://t.co/f4nYV7ESLV?amp=1) 

-  [ES6 Modules](https://t.co/JWwWnKGs5l?amp=1) 

_I hope found this useful and if you did please let me know. If you have any question feel free to DM me on  [Twitter](https://twitter.com/VladPasca5) ._
Covid-19, Programming and Optimization
Tags: covid19
Published: 2021-04-02 12:29:58

---
title: Covid-19, Programming and Optimization
published: true
description: What Covid-19 may have taught us about programming
tags: covid19
//cover_image: https://direct_url_to_image.jpg
---

Had a passing thought in mind:

Covid-19 showed us what happens when we have the mindset to abundantly misuse and waste natural resources and do whatever we please with nature. I find a very similar trend in the programming field as well - since we have enough hardware resources and CPU power, the tendency is to utilize (waste) as much of it possible by implementing questionable algorithms and solution strategies. We have to keep in mind that overuse of hardware resources and burning CPU power has an effect on nature as well. So we should always aim for the best and (super) optimized solutions when there is a chance of over-utilizing hardware resources and let go off convenience once in a while. This is one of the reasons, I am still not convinced about blockchain and functional programming because in my view they use too much resources which could have been saved.
Relevant methods to contact the Cash app customer service team:
Published: 2021-04-02 12:23:25

The practice of the right steps to connect the Cash app customer service team can help you to get rid of the troubles. The usual problems of the digital payment app should be managed with an accurate solution system. The regular use of the cash app account has led to an easier path to the customers. They all wish to have an online system to send and receive money and thus, they can try to get help from the cash app team. https://www.cashappcustomer-service.com/
Everything You Want to Know about How to increase cash app limit 
Published: 2021-04-02 12:22:39

The Cash app offers comparatively lower transaction limits than its competitors. The Cash app allows you to send $ 250 over a period of 7 days and receive $ 1000 over a period of 30 days. If you want to increase cash app limit your transaction limit, you can confirm your identity by entering your full name, date of birth, and the last 4 digits of the SSN. If the information provided is not sufficient to verify your account. However, the Cash app may ask you to provide additional information, you can visit our website.https://www.cashapp-customerservice.com/blog/how-to-increase-cash-app-limit/
Install Bootstrap 5 with Ruby on Rails 6+. Replace Bootstrap 4.
Tags: ruby, rails, bootstrap
Published: 2021-04-02 12:11:13

---
title: Install Bootstrap 5 with Ruby on Rails 6+. Replace Bootstrap 4.
published: true
tags: ruby,rails,rubyonrails,bootstrap
canonical_url: https://blog.corsego.com/rails-bootstrap-5-yarn
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rt47d08eggtq7pqnt238.png
---

console

```
yarn add bootstrap
yarn add @popperjs/core
```

application.html.erb

```
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
```

create a file `/app/javascript/stylesheets/application.scss`

## Version 1 - with stylesheets


application.js

```
import "bootstrap"
import "../stylesheets/application"
```

/app/javascript/stylesheets/application.scss

```
@import "bootstrap";
```

## Version 2 - empty stylesheets

application.js

```
import 'bootstrap/dist/js/bootstrap'
import "bootstrap/dist/css/bootstrap";
import "../stylesheets/application"
```

## Bonus: Remove jquery (needed for B4 but not B5

console

```
yarn remove jquery
```

environment.js - only this:

```
const { environment } = require('@rails/webpacker')
module.exports = environment
```

## Migrating from Bootstrap 4 with Bootstrap 5

Main changes from my experience:

* B4 has `badge badge-success`. B5 has `badge bg-success`.
navbar
dropdowns
* `.jumbotron` removed. use `.card` + `bg-light` instead
* replace `.card-deck` with something like `row row-cols-1 row-cols-md-2 g-4` or `card-group`
* replace `.form-group` with `mb-3`
* replace all dropdowns with bootstrap 5 dropdown code, **including navbar**
* `left` and `right` replaced with something like `start` and `end`, so we would have `<ul class="navbar-nav me-auto">` and `<ul class="navbar-nav me-auto">` for navbar-end (right) and navbar-start (left)
* `font-weight` replaced by `fw`

## That’s it!
Daily Developer Jokes - Friday, Apr 2, 2021
Tags: jokes, dailydeveloperjokes
Published: 2021-04-02 12:00:22

---
title: "Daily Developer Jokes - Friday, Apr 2, 2021"
description: "Check out today's daily developer joke! (a project by Fred Adams at xtrp.io)"
series: "Daily Developer Jokes"
cover_image: "https://private.xtrp.io/projects/DailyDeveloperJokes/thumbnail_generator/?date=Friday%2C%20Apr%202%2C%202021"
published: true
tags: #jokes, #dailydeveloperjokes
---

Generated by Daily Developer Jokes, a project by [Fred Adams](https://xtrp.io/) ([@xtrp](https://dev.to/xtrp) on DEV)

___Read about Daily Developer Jokes on [this blog post](https://xtrp.io/blog/2020/01/12/daily-jokes-bot-release/), and check out the [Daily Developer Jokes Website](https://dailydeveloperjokes.github.io/).___
### Today's Joke is...
![Joke Image](https://private.xtrp.io/projects/DailyDeveloperJokes/public_image_server/images/5e1258f2759b6.png)

---
*Have a joke idea for a future post? Email ___[xtrp@xtrp.io](mailto:xtrp@xtrp.io)___ with your suggestions!*

*This joke comes from [Dad-Jokes GitHub Repo by Wes Bos](https://github.com/wesbos/dad-jokes) (thank you!), whose owner has given me permission to use this joke with credit.*

<!-- 
Joke text:
___Q:___ What did the server say to his client who was having a bad day?

___A:___ Everything's going to be 200
 -->
Working under supervision !
Tags: redux, gamedev, devops, showdev
Published: 2021-04-02 11:59:45

We always want to get good feedback from what we did, but we forget that bad ones help us improve in what we do.  

After project I talked about in the last post, I then got feedbacks. Most of them were about improving something.  

I have been working on them this entire week, but not alone, with Galdys, my supervisor.  

### I want to mention how it helps when you have someone to guide you.  

With many things I had to work on, the most challenging one was __setting up Redux__ on the standard level as Awesomity Lab.  

I couldn’t set anything up alone as I had no reference.
But within few days, I was almost setup with both __Redux basics__ and other workflows.  

But how?
__Galdys__ told me to work besides her.
Every step and every move were supervised.
She showed me how to do it and she corrected me whenever I was wrong.  

I not only learned how __to set up Redux basics__ but also learned the other parts of best practices at __Awesomity Lab__.  

I remember when I started learning to code, I wanted to learn __PHP, Java, C, C++__...... 
And that’s not possible. It’s because I had no one to guide me.  

With no guidance, it’s just like walking in a strange forest with no map.  

As far as I can tell, it is better to have someone to guide you, even a virtual person can be important.  

When you are learning something new, please find someone to guide you!  

By the ways, my feedbacks were challenging that I reached Thursday overloaded.  

But what happened on Thursday? I played damn good game. I enjoyed with other interns as well as guys from Awesomity. I never wanted to go home!  

___Reach out guys, find someone to help you!___
Nead help to redux-thunk in react.
Published: 2021-04-02 11:49:17

Need help. I study react-redux-thunk. Rewrite working app to react-redux. And don't work redux-thunk request to server. Link to code: 
https://github.com/DmitryZhuravskiy/food-recipe-app/tree/redux-thunk

I think the problem is in action creator getData() . But there?

https://github.com/DmitryZhuravskiy/food-recipe-app/blob/redux-thunk/src/actions/index.js

Maybe, problem in reducer, NEED HELP!
Angular 6 HttpClient – Upload Files/Download Files to MySQL with Node.js/Express RestAPIs
Tags: angular6, mysql, node
Published: 2021-04-02 11:41:06

Angular 6 HttpClient – Upload Files/Download Files to MySQL with Node.js/Express RestAPIs – using Multer + Sequelize ORM

https://grokonez.com/frontend/angular/angular-6/angular-6-httpclient-upload-files-download-files-to-mysql-with-node-js-express-restapis-using-multer-sequelize-orm

In the tutorial, we show how to upload files, download files from Angular 6 Client to MySQL with Node.js RestAPIs server using Multer middleware and Sequelize ORM.

Related posts:
- <a href="https://grokonez.com/frontend/angular/angular-6/angular-6-upload-files-download-files-to-node-js-restapis-server-express-multer-bootstrap">Node.js/Express RestAPIs server – Angular 6 Upload/Download Files – Multer + Bootstrap</a>
- <a href="https://grokonez.com/frontend/angular/angular-6/angular-6-httpclient-node-js-express-sequelize-mysql-get-post-put-delete-restapis">Angular 6 HttpClient Crud + Node.js Express Sequelize + MySQL – Get/Post/Put/Delete RestAPIs</a>

<!--more-->
<h2>Technologies</h2>
<ul>
<li>Angular 6</li>
<li>RxJS 6</li>
<li>Bootstrap 4</li>
<li>Visual Studio Code – version 1.24.0</li>
<li>Nodejs – v8.11.3</li>
<li>Multer</li>
<li>Sequelize</li>
<li>MySQL</li>
</ul>
<h2>Overview</h2>
We create 2 projects: {Node.js, Angular}
<h3>Node.js RestAPIs</h3>
Project structure ->

<img src="https://grokonez.com/wp-content/uploads/2018/07/angular-6-http-client-upload-files-to-nodejs-rest-api-sequelize-mysql-nodejs-project-structure.png" alt="angular-6-http-client-upload-files-to-nodejs-rest-api-sequelize-mysql + nodejs-project-structure" width="244" height="358" class="alignnone size-full wp-image-13538" />

– Node.js project exposes RestAPIs to upload/download files:

<ul>
<li>router.post('/api/file/upload', upload.single("file"), fileWorker.uploadFile);</li>
<li>router.get('/api/file/all', fileWorker.listAllFiles);</li>
<li>router.get('/api/file/:id', fileWorker.downloadFile);</li>
</ul>

Configure <code>cross-origin</code> for Angular-Client which running at port: <code>4200</code>.

<pre><code class="language-javascript">
const cors = require('cors')
const corsOptions = {
  origin: 'http://localhost:4200',
  optionsSuccessStatus: 200
}
app.use(cors(corsOptions))
</code></pre>

<strong>Upload File</strong> ->


https://grokonez.com/frontend/angular/angular-6/angular-6-httpclient-upload-files-download-files-to-mysql-with-node-js-express-restapis-using-multer-sequelize-orm
I created a WakaTime client for Android
Tags: showdev, react, reactnative, metrics
Published: 2021-04-02 11:19:33

I just launched my first public app: Linitime.
From the Swahili for the word "When".

This app gives you an insight about your coding-behaviour using the [Wakatime](https://wakatime.com) api.
Information like:
* How long you worked today, in the past week, the past month, the past year and even in your whole lifetime
* Which projects you worked on, for how long?
* Which languages did you use, which device(s), platforms, ..
* You can even check your leaderboard and view some details about others
* and a lot more ..

This all beautifully packed in a clean react-native application.

Maybe try it out at [the Google PlayStore](https://play.google.com/store/apps/details?id=be.greifmatthias.wakaship),
and let me know what you think?!