teleren/devto huggingface dataset:
5 quick ways to center a div with CSS
Tags: css, beginners, tutorial, frontend
Published: 2022-10-29 04:35:41

Hello DEV community 👋 Centering div is one of the common problems encountered in front-end layout. Avoid long-windedness, here are five simple and common centering methods:


1. Using Flexbox
![using flexbox](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qkik0t0wuzxbxyoaywx1.png)

2. Using Grid
![using grid](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y7qhhwtlw8rurac6xjkz.png)

3. Using Position
![using position](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/12bs2nvpiuudtwb2zy8g.png)

4. Using Flex and Margin
![using flex and margin](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/e8l72oiopwliq0ynmqkk.png)

5. Using Grid and Margin
![using grid and margin](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/woghxgyo0gw79efga0sd.png)


That's it! 5 easy and quick ways to solve one of my most googled css problems in every situation. Welcome to comment if you know of any other way to center a div, cheers! 🦹‍♂️
2136. Leetcode solution in python3
Tags: python, challenge
Published: 2022-10-29 05:18:13

```python
class Solution:
  def earliestFullBloom(self, plantTime: List[int], growTime: List[int]) -> int:
    ans = 0
    time = 0

    for p, g in sorted([(p, g) for (p, g) in zip(plantTime, growTime)], key=lambda x: -x[1]):
      time += p
      ans = max(ans, time + g)

    return ans

```
#leetcode
#challenge
Here is the link for the problem:
https://leetcode.com/problems/earliest-possible-day-of-full-bloom/submissions/
Web Development Bookmarks
Published: 2022-10-29 04:08:58

### Hosting
- Website Hosting
  - Vercel
  - contabo (vps-provider) + docker + docker-compose + traefik hub
- Database Hosting
  - Docker Image of MySQL, PostgreSQL, MongoDB, etc on VPS server
  - [Razorhost-cpanel](https://razorhost.in/) - MySQL
  - [Railway.app](https://railway.app) - Postgresql, Redis, 
  - [MongoDB-Atlas](https://www.mongodb.com/) - MongoDB
- Email hosting
  - [Razorhost-cpanel](https://razorhost.in/)
  - [MailDev](https://github.com/maildev/maildev) - for testing
- Code Hosting
  - Github
- File Hosting
  - minio on vps, rclone to backup or transfer minio-server
  - Storj - 150 GB Free, $4/month/TB storage
  - [pCloud](https://www.pcloud.com/help/general-help-center/what-is-the-public-folder)
  - Contabo - $3/month/250GB
  - [Arweave](https://www.arweave.org/) - Permanent Hosting
- Domains
  - Hostinger (cheapest for 1st year)
  - Google Domains (buy for upto 9 years)
- VS-Code Hosting
  - Gitpod - $25 / month
  - CodeSandBox - $12 / month (does not work properly for now)
- VPS / Server Hosting
  - Contabo - good for long-term hosting, due to affordable yearly plans
  - Dropbox droplets - good for quick testing due hourly pricing
- Cpanel Hosting 
  - razorhost
- File Transfer
  - [pcloud](https://transfer.pcloud.com) - 5GB, password-protected
- File Backup
  - [contabo_object-storage](https://preline.co/index.html)
  - pCloud - affordable lifetime plans
  - notion - unlimited storage at $8/month
  - backblaze - unlimited storage at $7/month
- File Encryption
  - rclone
- Logo Creator
  - [Logo.com](https://app.logo.com/)
  - [Hatchful](https://www.shopify.com/tools/logo-maker)



### Frontend Stack
- Framework 
  - Next.js, ReactJS
- Development enviroment
  - docker-devcontainer: use only when needed
- State Manangment
  - [Jotai](https://www.npmjs.com/package/jotai)
- Beatification
  - TailwindCSS
  - [Preline](https://preline.co/index.html)
  - [DaisyUI](https://daisyui.com/)
  - [React-Toastify](https://www.npmjs.com/package/react-toastify)
  - [SweetAlert2](https://www.npmjs.com/package/sweetalert2)
  - [Animate.css](https://www.npmjs.com/package/animate.css)

# Avoid
- [NextAuth](https://next-auth.js.org/) - documentation is not user friendly, not sufficient options for modification
- Pocketbase - cannot delete columns in database once created
- Appwrite - self-hosting is difficult
- Hetzner - asks for identity verification
Adding link markdown support to rost_gen
Published: 2022-10-29 03:55:26

This week, I was tasked with adding another feature to my static site generator [rost_gen](https://github.com/Eakam1007/rost_gen) based on Docusaurus features. [Docusaurus](https://docusaurus.io/) is a great static site generator that has a lot of features. It provides a starting template, and even a command to [deploy to github pages](https://docusaurus.io/docs/deployment#deploying-to-github-pages).
After playing around with Docusaurus for a bit and some deliberation, I decided it would be best to add support for parsing links to other pages (internal and external). If implemented properly, it would allow me to easily add additional inline markdown features such as bold, italic, etc. I broke down the feature into several parts and created issues for them:

- [Implement functionality to parse individual lines](https://github.com/Eakam1007/rost_gen/issues/39)

- [Add support for link markdown](https://github.com/Eakam1007/rost_gen/issues/40)

- [Add support for image links](https://github.com/Eakam1007/rost_gen/issues/43)

- [Add support for stylesheet and script links and other head metadata such as title](https://github.com/Eakam1007/rost_gen/issues/44)

I estimated that I would be able to implement all of these this week. It did not take me long to figure out the logic for these features as it just involves checking each line for the correct markdown. So, I created branches as needed and starting implementing them. 
Line parsing was easy and I was able to finish it fairly quickly ([PR](https://github.com/Eakam1007/rost_gen/pull/41)).
However, since I do not have much experience in rust, it took me longer than I expected to code the logic for parsing links ([PR](https://github.com/Eakam1007/rost_gen/pull/42)). I had to learn about rust basics such as borrowing and mutable variables that I had not encountered in any other languages. 
Thus, as of writing this, I have only finished implementing the first two parts of the feature. That is, currently, any line with the following markdown will be converted into a link:
```
This is a [link](www.example.com) to www.example.com
```
The above markdown will result in the following html:
```html
This is a <a href="www.example.com">link</a> to www.example.com.
```
Next step would be to extend this markdown support for image links, which just adds an exclamation mark at the beginning:
```
![Image alt text](Image URL)
```
This would create an image tag with the specified alt text and URL.
Eventually, I also plan to implement the fourth part of the feature, which would be head metadata support. This would be something like the following markdown at the beginning of the markdown file:
```
---
title: Page title
stylesheet: _(Link to a stylesheet)_
stylesheet: _(Link to another stylesheet)_
script: _(Link to a script file)_
---
```
This would add the appropriate data/links to the head tag of the generated html. However, I have not yet decided if I want to use this syntax for multiple stylesheets.
【Unity】How to launch another exe placed at a relative path of the running exe.
Tags: unity3d, exe
Published: 2022-10-29 03:44:43

## Intro
I faced the situation that I would like to launch another exe placed at a relative path of the running exe. 

So I write the way down on this article so I won't forget.

## Sample Code

```CS
using System;
using System.Diagnostics;
using System.IO;
using UnityEngine;


public static class Launcher
{
    /// <summary>
    /// relative pass
    /// </summary>
    private static string path = "..\\..\\..\\target.exe";

    /// <summary>
    /// launch target exe and kill self
    /// </summary>
    public static void LaunchAndKillSelf()
    {
        //move current directory
        Directory.SetCurrentDirectory(AppDomain.CurrentDomain.BaseDirectory);
        
        //start process
        Process process = new Process();
        process.StartInfo.FileName = path;
        process.Start();
        
        //kill self
        Application.Quit();
    }
}

```

Working directory is changed if the running exe was launched by another exe.

The code below is a workaround for that.

```CS
Directory.SetCurrentDirectory(AppDomain.CurrentDomain.BaseDirectory);
```
Tkinter now...
Tags: agile, programming, python, opensource
Published: 2022-10-29 03:31:04

##Hmmmmmm
Welp, realized that the last post about Eel was not going well. Indeed, it was cool, but it was just a web server 🤷‍♂️, so I could do that on my own.

### Another solution?
CustomTkinter! An open sourced module in python that let's you run tkinter, but more beautifully 🤯. Not only is this module well maintained, but it has a modern feel! Just what I needed. Hank you TomSchimansky.
<br>
### Links
https://github.com/TomSchimansky/CustomTkinter


![Image desc](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9iaz83928jiwn14tbfa6.png)
vs
![ahhhhh](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6ebpbpc9nsgaumtozyxn.png)
🤯
![choooooooo](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/58ztn7u837p26m5tuhho.gif)
【Unity】How to get the game objects get using FindObjectsOfType in the same order as the hierarchy.
Tags: unity3d
Published: 2022-10-29 03:44:26

The list get using FindObjectsOfType is not in hierarchy order.
So, if you are important to use order, you must reorder the list.

## Sample Code

```CS
private void Awake()
{
    var monoComponentList = FindObjectsOfType<MonoComponent>().OrderBy(m=>m.transform.GetSiblingIndex()).ToList();
}
```

## Other Resources
[FindObjectsOfType order by hierarchy?](https://forum.unity.com/threads/findobjectsoftype-order-by-hierarchy.316109/)
Ubuntu aliases by a beginner for beginners
Tags: linux, ubuntu, beginners, tutorial
Published: 2022-10-29 03:38:11

Hello and welcome to my guide to creating aliases on Ubuntu. You can also find this on my [GitHub](https://github.com/kurtissfrost/linux-aliases). Before we begin, let me just say that I am no linux guru. There is probably another way to do this that is better but, this was how I learned how to do it and I want to share my process. For all examples listed below, I am using Ubuntu 22.04 LTS. Now, let's jump right on in!

---

Ok, so first off, you need to find a command that you either want to change because of the length, or because you want to map it to a different input for either ease of memory or for style. For example, the command to put a linux machine to sleep "systemctl suspend" That's kind of a length command. So let's change it to something both flashy and easier to remember like "goodnight"

---

1. Open your terminal up by either going to "show applications" or by using the keyboard shortcut ctrl+t.

2. In the terminal, type the following
> nano .bash_aliases

3. In your newly created file, type 
> alias goodnight='systemctl suspend'

4. For convenience. we should also add the following aliases (it will make sense later)
> alias SA='source .bash_aliases' <br /><br />
>alias aliases='nano .bash_aliases' 

5. Next, hit ctrl+x and then press Y. Once you do this, you can press enter and it will take you back to the terminal.<br /><br />

Unfortunately you can't just use your new shiny commands yet. You need to type 
>source .bash_aliases

Remember earlier when I said to add the alias CA? This is why. Unless you spice your aliases, the terminal won't recognize them. Now that we have that alias, instead of typing the nano command again, we can just type the word alias in the terminal to add more "aliases". Typing the word  "goodnight" will suspend our system and the command SA will source our changes.<br /><br />

---

## Other Examples:

>alias update='sudo apt update'
>alias upgrade='sudo apt upgrade'
>alias dejavi='echo dejavu'

---

Using this method, you are really only limited by your imagination. You can make the aliases silly, serious, or a combination of the two.<br />

[![git - the code](https://img.shields.io/badge/git-the_code-006600?style=for-the-badge&logo=github&logoColor=ffffff)](https://https://GitHub.com/kurtissfrost/linux-aliases)

Hopefully this guide has been helpful and you can create your own unique and interesting aliases. I definitely would love to take a crack at writing more tutorials and how to guides but, first I think I need to work on my skills a little bit more. But this was a fun little project for me to test the waters and see what I could come up with. Thank you so much for reading and have a wonderful day!

![signature](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tglxu86g9m11paowdsbx.png)
Create admin account
Published: 2022-10-29 03:36:30

```
INSERT INTO MEMBER (member_id, type, state, OPTCOUNTER) values(-3001, 'U', 1, 20);
INSERT INTO USERS(USERS_ID, DN, REGISTERTYPE, PROFILETYPE, LANGUAGE_ID, OPTCOUNTER ) values (-3001, 'uid=admin1,o=root organization', 'S', 'B', -1, 20);
INSERT INTO USERREG(USERS_ID, PLCYACCT_ID, STATUS, LOGONID, LOGONPASSWORD, PASSWORDEXPIRED, SALT, CHALLENGEQUESTION, CHALLENGEANSWER, TIMEOUT, OPTCOUNTER) values (-3001, -2, 1, 'admin1', 'tZYn+ylI3DfcFJaPAiwcBYxxnXBZtlP31YFUOY0bmsuyKm/X1SbViEHMKcFPJmCcsq5vykzxbgWne/F89d7z9g==', 0, '3h8x876vd8g3', null, null, -1, 20);
INSERT INTO BUSPROF(USERS_ID, ORG_ID) values(-3001, -2001);
INSERT INTO ADDRBOOK(ADDRBOOK_ID, MEMBER_ID, TYPE, DISPLAYNAME, DESCRIPTION) values (-3001, -3001, null, 'Internal User', null);
INSERT INTO ADDRESS(ADDRESS_ID, ADDRESSTYPE, MEMBER_ID, ADDRBOOK_ID, STATUS, ISPRIMARY, LASTNAME, FIRSTNAME,  PHONE1, ADDRESS1, NICKNAME, CITY, STATE, COUNTRY, ZIPCODE, EMAIL1, SELFADDRESS) values (-3001, 'SB', -3001, -3001, 'P', 1, 'Tom', 'Craw', '1-800-111-2222', '111 admin1 ave','admin1 nickname', 'admin1City', 'ON', 'CA', 'admin1zipcode', 'admin1@cc.com', 1);
INSERT INTO USERPROF(USERS_ID, DESCRIPTION, PREFERREDCOMM) values (-3001, 'Internal User', null);
INSERT INTO MBRROLE(member_id, role_id, ORGENTITY_ID) values (-3001, -1, -2001);
INSERT INTO mbrrel (DESCENDANT_ID, ANCESTOR_ID, SEQUENCE, OPTCOUNTER) VALUES (-3001, -2001, 1, 1);

```
Run SOLR indexing
Published: 2022-10-29 03:32:24


Check Solr Cores: 
```
http://localhost:3737/solr/admin/cores?
```

Query Search Index: 
```
http://localhost:3737/solr/MC_10001_CatalogGroup_en_US/select?q=*
```

Rest Api to build index
```
curl --user spiuser:passw0rd --insecure -X POST https://localhost:443/wcs/resources/admin/index/dataImport/build?masterCatalogId=10001

curl --user spiuser:passw0rd --insecure https://localhost:3738/search/admin/resources/index/build/status?jobStatusId=3003
```
dma_xfer_req
Tags: fpga, opensource
Published: 2022-10-29 02:35:35

I added an encoder in between the TX DMA and the DAC FIFO, and all the AXI signals go in and out of the encoder, but there's this one signal left called dma_xfer_req. It's produced by the DMA and consumed by the FIFO, but I have not yet figured out how to handle it. I think I'm going to have to have the encoder detect it and pass it along so that the FIFO works correctly. For now, while I'm trying to deal with some other errors, I've left it in place. You can see it in the cover image.
Docusoaring
Tags: programming, beginners, opensource
Published: 2022-10-29 00:20:25

## Docusaurus

Docusaurus is a way to easily build and deploy your own websites developed by facebook originally for the purpose of creating easy to customize documentation sites.

Since the purpose of the Docusaurus website and our Simple Static Site Generators are similar our task as a class this week was to find something we like in Docusaurus and to steal it, or begin to at least.

Our first task was actually to set-up and deploy a docusaurus website. To set up a Docusaurus website is not difficult, you just have to change a few configuration variables and you can deploy the baseline "tutorial" website to gitpages with a simple CLI command. To actually add to, customize and build out a docusaurus page can be a bit more time consuming but it's a far cry from creating your own website, this is a great way to start from an already built out template and to speed up the process of getting information up on the web.
I did so here: [Defaultosaurus](https://sfrunza13.github.io/docusaur/).

One of the things that immediately stands out about Docusaurus is this pretty single page concept for the design and ***I wanted it***. So as a first step in that direction I abandoned my previous implementation of having an index page that would redirect to my generated markdown and html files and instead I built out a navbar that would always stick to the left side of my website.

It's not as pretty as docusaurus's and it is not collapsible yet, it's a very simple list of buttons that will send you to the selected generated page.

![Stolen Nav Idea](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7h2d1rq5e8z23nifbfsy.png)

The issue that I filed for this:[Replace index w navbar](https://github.com/sfrunza13/SiteGenerationTool/issues/11)
The commit:[7435a0](https://github.com/sfrunza13/SiteGenerationTool/commit/7435a0eeb73b46622e4c0ab0f7d9918aca75141c)

## Thinking ahead

In the future I hope to find a way to stop the page from reloading whenever a link is clicked, I remember React and Angular made this easy but I am not sure how to make my current Python generating HTML implementation as seamless as my previous framework based projects. We will see if this is something I can achieve.

More concretely I have a few ideas for improvements in the future underneath my issues tab on github. I want to take a look at replacing the markdown implementation I currently have with a pre-existing popular library for Python programs so that I can get full markdown support and I also want to build out the navbar to be perhaps be able to include elements that are not generated, maybe some custom links leading to external pages or something, I don't quite know yet.

I will continue to consider what I would like to add to the website and put up issues because maybe someone will come along and pick them up.
Learn To Build an App with the AWS Cloud
Tags: aws, beginners, programming, tutorial
Published: 2022-10-29 00:17:34


## I am

so excited to announce that we are very close to opening the doors for a new AWS Journey 🎉 **#AWSJourney**

I've been working full-time for the last 3 months on this course.

I've realized that creating a good course, that will actually help you get closer to your goals  , is very hard. It required a lot of planning when it comes to the structure of the course, keeping in mind the end product that you will build.

I made sure to cover a very wide set of skills that would help you with the whole process.

## Course Objective 💪

You've probably already heard of cloud computing, `aws`, `lambda` functions, `s3` buckets, but maybe have no idea what those things are. Good news! This course serve as an introduction to all of these things and more!

You'll learn how to deploy a `cdk` template, write your first `lambda` function, initialize a new `s3` bucket to store your assets, save things in a NoSQL database called `dynamoDB`, connect a `react` application to your backend and deploy all of it to a CDN!

By the end of the course you'll not only have a good understanding of (some of) `aws` features, you'll also have a working application deployed live on the internet.


## Notes - Table of Contents 📜

- 00-Intro and Welcome
- 01-Install AWS Cloud Development Kit (CDK) and create a new project
- 02-Build and deploy a sample AWS Cloud Development Kit stack to AWS
- 03-Review an AWS CloudFormation stack deployed with AWS CDK
- 04-Clear an initial AWS CDK stack to start building an app from scratch
- 05-Create and deploy a lambda function with AWS CDK
- 06-Review and execute a lambda function deployed with CDK in AWS Console
- 07-Change the properties of a lambda function deployed with AWS CDK
- 08-Attach an API Gateway to a lambda function deployed with AWS CDK
- 09-Pass environment variables to a lambda function deployed with AWS CDK
- 10-Run lambda functions built with CDK locally using AWS SAM
- 11-Create and deploy an S3 bucket with AWS CDK
- 12-Make the contents of an S3 bucket deployed with CDK public
- 13-Create an S3 event notification to trigger a lambda function on file upload
- 14-Use a bucket deployment to upload a file to S3 when deploying a CDK stack
- 15-Create a custom AWS CDK construct
- 16-Create a DynamoDB table with AWS CDK
- 17-Get all items from a DynamoDB table deployed with CDK using DocumentClient API
- 18-Debug permission issues and allow a lambda function to access data from a DynamoDB table
- 19-Adding data to a DynamoDB table with put operation
- 20-Delete an item from a DynamoDB table with delete operation
- 21-Add external dependencies to an AWS Lambda function deployed with CDK
- 22-Connect React app to a serverless backend deployed with CDK and fix CORS issues
- 23-Add a custom CloudFormation stack output with CDK
- 24-Deploy a static website to S3 with AWS CDK
- 25-Deploy a site with HTTPS support behind a CDN with CDK
- 26-Destroy an AWS CDK stack


 [ENROLL NOW](https://nothanii.vercel.app/blog/learn-to-build-an-app-with-the-aws-cloud-development-kit)
Accessing request from any server component in Deno Fresh
Published: 2022-10-29 00:02:37

Within [Deno Fresh](https://fresh.deno.dev/) a route can have access to the request via an exported handler. What if you have a tree of components, and you'd like to access the `request` from any point in the tree? 

The code below creates a request context and provider that you can use on all your pages.

```tsx
export const handler: Handlers<Request> = {
  GET(request, ctx) {
    return ctx.render(request);
  },
  POST(request, ctx) {
    return ctx.render(request);
  },
  PUT(request, ctx) {
    return ctx.render(request);
  },
  DELETE(request, ctx) {
    return ctx.render(request);
  },
};

const RequestContext = createContext(new Request('http://localhost:8000/'));

export const useRequest = () => useContext(RequestContext);

export function withRequest(Component: () => JSX.Element) {
  return ({ data }: PageProps<Request>) => {
    return (
      <RequestContext.Provider value={data}>
        {<Component/>}
      </RequestContext.Provider>
    )
  }
}
```

To use in your route:

```tsx
import { handler, withRequest, useRequest } from "../lib/request";

export { handler }

const Greeting = () => {
  const { url } = useRequest()
  return <div>{url}</div>
}

export default withRequest(() => {
  return (
    <Greeting/>
  )
})
```