Since 2010 I worked on many projects, mainly on private ones.
Technical Certificate on Computer Systems
Higher Level Education Certificate on Web Application Development
FreeCodeCamp certifications:
And more... Keep reading below to find it out
@use only which you need.
// Excerpt from Katana-UI flexbox layout
@use 'vars/breakpoints';
.flexrow {
display: flex;
flex-flow: row wrap;
margin: 0 calc(#{$col-margin}/2 *-1);
.element, [class*='col-'] {
margin: calc(#{breakpoints.$col-margin}/2);
word-wrap: break-word;
}
}
// Toggle password visibility
function togglePassword (id, el) {
var x = document.getElementById(id);
if (x.type === "password") {
x.type = "text";
el.className = 'fa fa-eye showpwd';
} else {
x.type = "password";
el.className = 'fa fa-eye-slash showpwd';
}
}
"_comment": "Excerpt from this portfolio package.json using Parcel.js bundler",
"name": "main",
"version": "1.0.0",
"main": "index.js",
"license": "MIT",
"scripts": {
"start": "parcel index.html",
"build": "parcel build index.html -d build/"
},
"author": "JoelBonetR"
}
/* Simple preact snippet that shows current day month and year */
import './style';
import { Component, h, render } from 'preact';
export default class App extends Component {
render() { return (
<div>
<h1>Today's date!</h1>
<div className="clock">
<span>{new Date().getDay() + '/' + new Date().getMonth() + 1 + '/' + new Date().getFullYear()}</span>
</div>
</div>
);}
}
render( <App />, document.getElementById('app-container') );
<!-- for productivity increase!
The following emmet... -->
html>(head>title{test})+body>div.container>(div.flexrow.row-1-el.sm-row-2-el>div.element*3)+(div.flexrow>(div.col-50>p{text one})+(div.col-50>span{text two}))
<!-- ... converts into the structure below -->
<html>
<head>
<title>test</title>
</head>
<body>
<div class="container">
<div class="flexrow row-1-el sm-row-2-el">
<div class="element"></div>
<div class="element"></div>
<div class="element"></div>
</div>
<div class="flexrow">
<div class="col-50">
<p>text one</p>
</div>
<div class="col-50">
<span>text two</span>
</div>
</div>
</div>
</body>
</html>
// Excerpt from Angular tour of heroes.
export class HeroListComponent implements OnInit {
heroes: Hero[];
selectedHero: Hero;
constructor(private service: HeroService) { }
ngOnInit() {
this.heroes = this.service.getHeroes();
}
selectHero(hero: Hero) { this.selectedHero = hero; }
}
Git commands and simple basic CI
/home/.../projects/portfolio/.gitlab-ci.yml
stages:
- deploy
deploy:
stage: deploy
image: debian:stretch-slim
only:
- master
script:
- apt-get update && apt install -y --no-install-recommends lftp
- lftp -e "set ftp:ssl-allow yes; set ssl:verify-certificate yes; mirror -R ./ "$PATH -p 22 -u $USER, $PASSWORD $REMOTE_HOST
git add .gitlab-ci.yml
git commit -m "Add CI script"
git push master
// Excerpt from PHP mailer.
$headers = 'From: '. $email . "\r\n" .
'Reply-To: '. $email . "\r\n" .
'X-Mailer: PHP/' . phpversion();
$status = Mail::send($to, $subject, $message, $headers);
if($status == TRUE){
// MySQL Snippet.
SHOW CREATE TABLE foo;
Table: foo
Create Table: CREATE TABLE `t` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`name` char(60) DEFAULT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4
Also working, worked or sometimes use for fun, learning or need: jQuery, Java, Android, Kotlin, C#, Python, Svelte.js, Bootstrap, shell script, SQL Server, Mustard UI, React, Redux,
Webpack, Rollup, Parcel.js, Yarn, npm, npx, Cypress, docker, wordpress, woocommerce, prestashop... 
Car Workshop. Family business. Nice people on it - if you are near and you're in need, you know, come in!
We repaired a Hot-Rod, a car from the movie Fast & Furious (100% real), traktors, cars, mobile homes and whatever with some bolts and gears on it.
I think I re-built this website like thousand times more or less, so please appreciate it.
