Skip to content

Instantly share code, notes, and snippets.

View debonx's full-sized avatar
🍕
Food processing

Emanuele De Boni debonx

🍕
Food processing
View GitHub Profile
@debonx
debonx / react-container-component.js
Created January 4, 2020 11:17
React: Container components from presentational components.
/* Separating container components from presentational components is a popular React programming pattern.
Here’s the basic idea behind it: if a component has to have state, make calculations based on props, or manage any other complex logic, then that component shouldn’t also have to render HTML-like JSX.
Instead of rendering HTML-like JSX, the component should render another component. It should be that component’s job to render HTML-like JSX.
Following this pattern separates your business logic from your presentational logic. */
import React from 'react';
import ReactDOM from 'react-dom';
import { GuineaPigs } from '../components/GuineaPigs';
const GUINEAPATHS = [
@debonx
debonx / react-stateless-functional-component.js
Created January 2, 2020 19:00
React: Stateless functional component example.
// Normal way to display a prop:
export class MyComponentClass extends React.Component {
render() {
return <h1>{this.props.title}</h1>;
}
}
// Stateless functional component way to display a prop:
export const MyComponentClass = (props) => {
return <h1>{props.title}</h1>;
@debonx
debonx / react-proptypes.js
Last active January 2, 2020 17:21
React: How to set propTypes stateless component.
import React from 'react';
export class BestSeller extends React.Component {
render() {
return (
<li>
Title: <span>
{this.props.title}
</span><br />
@debonx
debonx / react-password-form.js
Last active January 2, 2020 17:21
React: Password form component.
import React from 'react';
import ReactDOM from 'react-dom';
class Follow extends React.Component {
constructor(props) {
super(props);
this.state = {
password: 'huraji',
authorized: false
};
@debonx
debonx / naive_bayes_classifier.py
Last active November 28, 2020 11:05
Naive Bayes classifier in Python
#Import datasets and libraries
from sklearn.datasets import fetch_20newsgroups
from sklearn.naive_bayes import MultinomialNB
from sklearn.feature_extraction.text import CountVectorizer
#Category selection to compare different datasets of emails and evaluate how hard is to distinguish those.
the_categories = ['comp.sys.ibm.pc.hardware', 'rec.sport.hockey']
train_emails = fetch_20newsgroups(categories = the_categories, subset = 'train', shuffle = True, random_state = 108)
test_emails = fetch_20newsgroups(categories = the_categories, subset = 'test', shuffle = True, random_state = 108)

Using the classnames.bind method

Many people who work with React are familiar with the excellent classnames library. If you aren't familiar, it provides a simple function for gluing classnames together. In web programming in general, there are many times that we need to add or remove multiple classes based on conditional logic. The classnames library makes this easy.

More and more developers are embracing CSS Next and the power of CSS modules. However, when you add CSS modules to your react components, working with classnames gets more difficult. Typically, CSS modules is implemented with class name mangling. Transforming human readable class name strings into unique identifiers helps ensure that every class name in your app is unique.

This means that you can write your component CSS in isolation without worrying about the dreaded class name collisions that have plagued CSS

@eyecatchup
eyecatchup / node-cms.md
Last active February 26, 2023 07:47
[WIP] List of Node-based content management systems (CMS)
@filippo-quacquarelli
filippo-quacquarelli / custom-endpoint.php
Last active September 19, 2019 13:06
Tutorial for custom endpoint WordPress
<?php
// ecco l'action che fa funzionare la nostra chiamata
add_action('rest_api_init', function () {
// registriamo la nuova rotta, il primo parametro equivale al namespace, potrebbe essere myplugin/v1 ecc ecc
// il secondo parametro equivale al percorso che vogliamo usare e le eventuali opzioni,
// in questo esempio abbiamo aggiunto il parametro id, questo valore sarà poi disponibile nella funzione di callback
register_rest_route( 'test/v1', '/post/(?P<id>\d+)', array(
'methods' => 'GET', // specifichiamo il metodo http
// specifichiamo la funzione di callback dove andremo a specificare cosa ritornare
@giovanigenerali
giovanigenerali / postfix-gmail-macos.md
Last active December 20, 2021 20:07
Postfix Gmail relay on macOS Sierra & macOSHigh Sierra

Postfix Gmail relay on macOS Sierra & macOSHigh Sierra

1 - Create a file to store our credentials:

sudo vim /etc/postfix/sasl_passwd

2 - Add something like this:

@wwwebman
wwwebman / docker-compose.yml
Last active February 3, 2023 05:28
Docker Compose For Wordpress, Maria/MYSQL, phpMyAdmin
version: '2'
services:
db:
container_name: database
image: mariadb # Pull mysql image from Docker Hub
ports: # Set up ports exposed for other containers to connect to
- "3306:3306"
volumes:
- ./dep/mysql:/docker-entrypoint-initdb.d