DEV Community: Corentin Bettiol

Django simple notes

Corentin Bettiol — Wed, 24 May 2023 11:11:42 +0000

Hi, I released a new module today; Django simple notes.

Can I have a screenshot or two, please?

Sure.

New toolbar menu!

Store notes related to a single page.

What's this?

It's a (very) simple module that adds a new button on the CMS toolbar, which allow administrators to open a side-panel and store/retrieve notes linked to the current page.

How it works?

This module is using Django's generic foreign keys to store notes linked to pages.

It handles CMS Page and djangocms-blog Post objects by default, but you can write your own settings to extends the support to your own types of objects.

More information is available on the README.

Features

Create/edit notes linked to pages you're currently visiting.
Add tags to notes.
Different notes for different languages for the same page.
List all notes.
Search note content and tags in list view.
Sort notes in list view (create/edit date, author, page language...).

Thoughts?

What do you think of this package? What features do you find missing? Will you use this application? We would love to hear your opinion :)

100+

Corentin Bettiol — Tue, 14 Jun 2022 16:12:04 +0000

Hi,

I just realized that the module I created a few years ago just broke the 100 likes mark on github, and I wanted to share how happy I am!

It was my first project when I started working with Kapt.

Today, Django Check SEO is the most known open source module made by Kapt (but it's not the only one, you can find a list of our open source python modules on PyPi[0]). It's one of our last Python module hosted on Github, since we're using Gitlab since a few years and it's working well.

This module (and the posts I made to share it with the community of web developers) was a big step for me, and I watched the numbers go up and up as the months passed.

Today I think that this project reached a new high, since it received its first PR from another developer! It's really cool to see that all of our hard work is helping others, and that sometimes other people will work with our project, not only for them, but for all the other devs too.

The number of likes looks like it's really low, but you can see that Django Check SEO is 11th on the topic django-cms on Github :P

So thank you all, keep creating nice modules we can use, we're still creating nice modules too, sharing is really something cool to do on Internet!

[0] One example is this lovely little module named "djangocms-filer-display-pages-where-files-are-used-before-removing-them".

DjangoCMS FAQ

Corentin Bettiol — Mon, 26 Apr 2021 14:11:45 +0000

My company released a cool open-source plugin named DjangoCMS FAQ that you can use in your websites a few weeks ago, let me describe it:

Install

The project is on pypi, so just use pip!

python3 -m pip install djangocms-faq

Features

FAQ Plugins

Create a FaqContainer Plugin that have a name, and can only contain FaqQuestion Plugins that have a name (the question) and keywords!
Create answers as TextPlugin, ImagePlugin or VideoPlugin inside the FaqQuestion Plugins (this can be easily extended using the settings of your project)!
Here's a small gif (better video here in the readme):

FAQ Search Plugin

Create a FaqSearchPlugin that have a name, select all the FaqContainers that this instance will search into, and put it on any page on your site!
Here's a small gif (better video here in the readme):

Settings

If you don't need the FaqSearch you can set the DJANGOCMS_FAQ_ENABLE_API variable to False in your settings.
You can add as many Plugins as you want in the FaqQuestion plugins using the DJANGOCMS_FAQ_ANSWER_PLUGINS list in your settings.
If you don't wanna show the keywords in the questions, just put this var to False: DJANGOCMS_FAQ_SHOW_KEYWORDS_QUESTION.
And if you don't want to show the keywords in the FaqSearch Plugin answers then put this to False in your settings : DJANGOCMS_FAQ_SHOW_KEYWORDS_ANSWER.

How to hide a tag on dev.to

Corentin Bettiol — Tue, 19 Jan 2021 13:53:20 +0000

Follow a tag describing something you don't actually want to follow, like the #javascript tag (trust me please),
Click on the not-so cranked wheel to go to the page that handles the weights of your tags (here's the link: https://dev.to/dashboard/following_tags),
Set the weight of the tag you didn't like to -999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999 or something like this,
Enjoy browsing dev.to without this popular tags on literally every page of the site!

(oh the output of the value in step 3 is funny, it even have a "anti follow" notice)

What do you think about 1MB.club?

Corentin Bettiol — Fri, 27 Nov 2020 14:29:46 +0000

1MB.club is a website created by Bradley Taunt listing other websites, where your website is added to the list if it weights less than 1MB.

What do you think of this type of index?

1M Club was shared a few days ago on Hacker News, and therefore has gained popularity quite quickly.

Share some blazing fast and lightweight websites

Corentin Bettiol — Thu, 15 Oct 2020 12:59:04 +0000

Hi 👋

I like ultra fast websites, built using vanilla technologies.

But I don't know a lot of those websites. Help me discover more of the "small web" by sharing small & fast websites here, please :)

What is the lighthouse score of your porfolio/personal website (and why)?

Corentin Bettiol — Wed, 23 Sep 2020 07:23:13 +0000

I want to discover new portfolios, and in order to do it I want you to post and discuss your lighthouse score.

For thoses who don't know what I'm talking about, here's the doc for lighthouse.

How to efficiently download thousands of files?

Corentin Bettiol — Fri, 04 Sep 2020 13:27:05 +0000

Hello.

I need to copy ~40,000 files from a server to my computer, and I'm wondering what is the best approach to solve this problem.

using `scp`

slow
consume lots of bandwidth

using `rsync`

slow
consume less bandwidth
can resume copy after a network problem

using `tar` then `scp`

less slow
consume less bandwidth

using `tar` then `rsync`

less slow
consume less bandwidth
can resume copy after a network problem

using `tar` then `split` then `parallel` with `scp`

fast
consume less bandwidth

using `tar` then `split` then `parallel` with `rsync`

fast
consume less bandwidth
can resume copy after a network problem

I think I will opt for the last one, but what would you do in my case?

Edit: bash commands for using tar then split then parallel with rsync:

Prerequisite: Install parallel and remove warning:

sudo apt install parallel && echo "will cite" | parallel --citation &>/dev/null

# on server
tar cfz files.tar.gz ~/path/to/folder/
split -b 20M files.tar.gz fragment_

# on local machine
cat $(ssh host@server ls -1 fragment_*) | parallel rsync -z host@server:{} .
cat frament_* > files.tar.gz
tar xvf files.tar.gz

Edit 2: I used a simple rsync command, since it can compress files on the fly and handle restart from where the transfer stopped.

Since rsync always use the max bandwidth available it isn't a bottleneck that can be solved with parallel.

What are your favorite articles on dev.to?

Corentin Bettiol — Mon, 24 Aug 2020 20:31:14 +0000

The algorithms that help us find relevant content on dev.to are something, but I think we all have favorite articles about development, and I want to discover new content that is not trendy or based on the tags I follow.

Here's mine so far

The serie Javascript Visuzalized, by Lydia Hallie.
Pimp your Blog: Calculate the 'reading time' by Rob OLeary.
How to create fancy revealing animations with these simple CSS tricks, by Carlos Roso.

What's yours?

How to make super duper shadows for your screenshots

Corentin Bettiol — Mon, 03 Aug 2020 10:15:12 +0000

Today we will customize our screenshots.

tl;dr: only read step 7

1 - Base

On linux, almost each distro include a cool soft to make screenshots, e.g. on xfce (xubuntu), I have xfce4-screenshooter.

It may sound cool to think "hey can I add some smooth drop shadow to this screenshot ?", and it is indeed a good idea to share good-looking screenshots.

2 - How to do this?

Well, first, let's be sure that nobody ever thought about it.

Uh, someone may have ever thought about the concept of adding cool drop shadow on an image on linux using the command line.

Uh. Maybe someone have already thought about that.

Let's see what Takkat said:

I would recommend the ultimate command line tool for bitmap manipulations: ImageMagick.
It should be available through your distribution repositories. This tool comes with many effects, including generating a drop shadow.
This is basically done with the convert -shadow option but you then need to combine the generated background image again with the original. This can all be done in a one-line command using -layers merge option:

convert input.jpg \( +clone -background black -shadow 50x10+15+15 \) +swap -background none -layers merge +repage shadow.png

3 - How do Takkat would do this ?

He uses the command above, with convert, then using +clone -background black and -shadow percent-opacity{xsigma}{+-}x{+-}y{%} and a +swap -background none -layers merge +repage. Is it clear ?

Fortunately, we don't have to fully understand what all this text says, because ImageMagick will understand this correctly and will output a cool looking shadow behind our src image.

4 - Asking the real question

How to add the previous command to a very simple workflow (screenshot page, add it to clipboard -> add shadow to image in clipboard) ?

I already have my screenshot inside my clipboard at the end of the screenshot page, add it to clipboard phase. That's nice.

All I have to do is:
1) Save my screenshot into a file
2) Use the convert command
3) Save the result in a file
4) Copy the file content inside my clipboard
5) Remove the saved file to only keep my clipboard content

And it's pretty easy.

5 - My script

I wrote this script, which essentially does every step and is working flawlessly:

addshadows.sh

#!/bin/bash
xclip -selection clipboard -t image/png -o > "screenshot.png"
convert screenshot.png \( +clone -background black -shadow 75x10+0+0 \) +swap -bordercolor none -border 10 -background none -layers merge +repage shadow.png
xclip -selection clipboard -t image/png -i shadow.png
rm screenshot.png shadow.png

Explanations

The first line gets the image stored in my clipboard using xclip, and save it in a file named screenshot.png.
Second line is the convert command from imagemagick we've discovered previously. Oh, it also saves the generated image in a file named shadow.png.
The third line uses xclip to copy the content of shadow.png into my clipboard.
The last line removes the two images from the disk, letting only the shadow version living in my clipboard.

6 - How to launch it?

I already put the xfce4-screenshoter shortcut in my topbar, and that's what I did for my script too!

XFCE docs have a very good article about launchers, so I think I will let you discover this if you want to.

I added a nice icon in order to recognize it on my topbar:

So now our workflow is :
1) click the (xfce4-)screenshot button

click to select type of screenshot (whole screen, current window, part of the screen)
select the window/the region
click the "copy to clipboard" button

2) click the addshadows.sh button
3) paste our image somewhere on the web and share it

7 - But what if we want to launch it using a keyboard shortcut only ?

This example is gonna use flameshot, a great screenshot tool.

We need to update our script, and to add a new keyboard shortcut.

addshadows_flameshot.sh

#!/bin/bash

flameshot gui -r >> /path/to/addshadows/screenshot.png
convert screenshot.png \( +clone -background black -shadow 75x10+0+0 \) +swap -bordercolor none -border 10 -background none -layers merge +repage shadow.png
xclip -selection clipboard -t image/png -i shadow.png
rm screenshot.png shadow.png

As you can see in the source code, we just replaced the line where we save an image from our clipboard by the flameshot command (that will then save a screenshot.png file), and we added full paths of files (the script will be launched from ~, so it will need to know where to find/save the images).

Here's the command that you need to bind to a keyboard event:

/path/to/addshadows/addshadows_flameshot.sh

Fortunately, it's very easy to add a new shortcut using xfce (and any other linux distro).

You now just have to push a key to enter the screenshot-mode of flameshot, and then a shadow will automatically be added to your image!

8 - An example?

All the screenshots on this page are using this trick, but here it is:

Edit: made a slow-mo on this short video to show the creation of the files (and their deletion) :)

Thank you for reading this article!

Have fun with screenshots using a powerful tool and adding pretty shadows :)

Random gists

Corentin Bettiol — Fri, 24 Apr 2020 09:06:25 +0000

Hello, today I will share some cool little gists that I created.

"Wait, you're using gists?!?"

Yup. You can share them, they are not tied to any project, and you can even comment them. The main flaw is that they don't have an explicit URL.

Install & create a django-cms+djangocms-blog website in two minutes

This first gist is available here.

When testing applications related to django-cms, sometimes they are only compatible with python3/django2.2/django-cms3.X configurations, so I created this gist that allows me to quickly create test projects.

Install a working search engine for a django-cms/djangocms-blog website using solr

Here is the link.

It's my solution at an annoying problem. Install haystack, aldryn-search, solr, and create a fully functional search bar on your website.

oh-my-zsh + agnoster theme inside vscode inside a container (using remote-containers)

Okay, this one is unusual.

We use docker with some containers in our dev-env. Some of use use a container with all of our projects inside (so we can work on our projects in a controlled environment).

We're using vscode with the remote-containers extension, but zsh isn't working out of the box on the embedded vscode terminal. So I made a gist.

addshadows.sh

I always wanted to add some fancy shadows on my screenshots (see this post :P). The code source of my little program is here.

edit: created a whole post on this script (and a little bonus) :)

Very simple timetracking tool

I wanted to keep track of what I was doing, but didn't want to use a heavy application with a lot of settings. So I made a gist.

Publish-to-pypi script

I was worried to make a mistake when publishing a package to pypi (I'm thinking at django-check-seo or djangocms-darksky-api), so I made a gist that contains a simple bash script to automate this task.

I even created a tl;dr version of the official python packaging doc here (with some common errors and the solutions).

That's all the interesting public gists I have created.

Are you using gihub gist like I do?

Custom emoji cursors with SVG

Corentin Bettiol — Thu, 23 Apr 2020 15:59:25 +0000

I was visiting some websites this morning, when I discovered emojicursor.app

And I started testing things, who leaded to... this:

Result on xubuntu/firefox:

This is a bad idea, since the emojis will render differently depending on your platform and browser (and will not appear at all if you're on smartphone), but it's interesting to know that you can mess up with svg and emojis on cursor property.

And you, have you discovered some strange and/or unknown useless css tricks ?

DEV Community: Corentin Bettiol

Django simple notes

Can I have a screenshot or two, please?

What's this?

How it works?

Features

Thoughts?

100+

DjangoCMS FAQ

Install

Features

FAQ Plugins

FAQ Search Plugin

Settings

How to hide a tag on dev.to

What do you think about 1MB.club?

Share some blazing fast and lightweight websites

What is the lighthouse score of your porfolio/personal website (and why)?

How to efficiently download thousands of files?

using scp

using rsync

using tar then scp

using tar then rsync

using tar then split then parallel with scp

using tar then split then parallel with rsync

What are your favorite articles on dev.to?

How to make super duper shadows for your screenshots

1 - Base

2 - How to do this?

3 - How do Takkat would do this ?

4 - Asking the real question

5 - My script

Explanations

6 - How to launch it?

7 - But what if we want to launch it using a keyboard shortcut only ?

8 - An example?

Random gists

Install & create a django-cms+djangocms-blog website in two minutes

Install a working search engine for a django-cms/djangocms-blog website using solr

oh-my-zsh + agnoster theme inside vscode inside a container (using remote-containers)

addshadows.sh

Very simple timetracking tool

Publish-to-pypi script

Custom emoji cursors with SVG

using `scp`

using `rsync`

using `tar` then `scp`

using `tar` then `rsync`

using `tar` then `split` then `parallel` with `scp`

using `tar` then `split` then `parallel` with `rsync`