---
# System prepended metadata

title: EPFL / PowerCoders (v2)
tags: [Talk]

---

---
title: EPFL / PowerCoders (v2)
tags: Talk
description: A presentation of EPFL activites for PowerCoders (v2)
slideOptions:
  transition: fade
  theme: black
---

# Welcome

![](https://powercoders.org/img/powercoders-logo.svg)
<br />
<br />
<br />
**Make sure to read this presentation from https://go.epfl.ch/PCSlides2**

---

### Content

* From EPFL to IDEV-FSD
* Some project
* Coding dojo
* Tips
* Discussion 

---

<!-- .slide: data-background="https://i.imgur.com/WaEysKQ.jpg" data-id="slide-epfl" data-contrast="on" -->

## EPFL = Academic

### 3 missions: education, research and innovation

----

#### Numbers

* EPFL: \> **15000 people**
* EPFL employees (scientific, administrative & technical staff): \> **5700 people**
* EPFL / SI (Information Systems): \> **130 people**
* EPFL / SI / IDEV (Engineering and Development): \> **40 people**
* EPFL / SI / IDEV / <span class="more">**FSD**</span> (Full-Stack Development): <span class="more">**8 people**</span>


<center><small>https://www.epfl.ch/about/overview/overview/figures/</small></center>

----

#### Full-Stack Development

This team is made of “Full-Stack” developpers[...]. The main responsibility of the team is software development, maintenance and evolutions of EPFL Web applications. Also the application of **DevOps methodology** in order to enhance **development cycle** (code, test, release, monitor, and maintain) of existing infrastructure.

----

#### DevOps

![](https://i.imgur.com/zUxHtgt.png)


---

<!-- .slide: data-background="https://i.imgur.com/K6Iy6FQ.jpg" data-id="slide-epfl" data-contrast="on" -->


## Projects

1. Jahia to WordPress
1. Tracking of old EPFL logo
1. Network Operation Center (NOC)
1. gitlab.epfl.ch
1. go.epfl.ch
1. Others projects

<center><small>Photo by Uwe Hensel on Unsplash</small></center>

----

## Jahia to WordPress

  * Migration of 800 websites from Jahia to Wordpress
  * Script to migrate website
  * Infrasctructure with Docker and OpenShift
  * Automated deployment with Ansible

----

## Tracking of old EPFL logo

Late last year the EPFL logo was updated, but the old one was still on many web pages.

![](https://i.imgur.com/DfaqRBC.jpg =600x)


----

## Network Operation Center (NOC)

![](https://i.imgur.com/xUJ2iGZ.png)

----

## Gitlab
Service offered on premise to all EPFL users:

![](https://i.imgur.com/D6lGDyS.png)

----

## go.epfl.ch

Where "https://www.epfl.ch/about/vice-presidencies/vice-presidencies/information-systems/governance-development-and-operations/projects-development-and-systems-engineering/" becomes [https://go.epfl.ch/fsd](https://go.epfl.ch/fsd).

![](https://i.imgur.com/xzCk8lo.png)


----

## Other projects

 * Maintenance
 * Maintenance
 * (a lot of)
 * Maintenance

Maintenance work: update, improvement, extension, security fix, deployment architecture of ageing projects<br/> (inForm, grantsDB, LHD, Blog, Wiki)

---

<!-- .slide: data-background="https://i.imgur.com/SH788tW.jpg" data-id="slide-dojo" data-contrast="on" -->

## Coding Dojo

<br />
<br />
<br />

<center><small>Photo by Kaleidico on Unsplash</small></center>

----

#### What's a coding dojo

> A Coding Dojo is a meeting where a bunch of coders get together to work on a programming challenge. They are there to have fun and to engage in [deliberate practice](http://codingdojo.org/DeliberatePractice) in order to improve their skills.
<center><small>http://codingdojo.org/WhatIsCodingDojo/</small></center>

----

#### How (workflow)

* a subject
* one laptop
* one timer
* 5min/turn to progress on the subject

----

## EPFL Dojos

![dojologo >](https://i.imgur.com/jVGPBfJ.png =200x200)

* Dojo for apprentices (trainees)
* Dojo for developers (advanced)

<br />
<br />
One hour each, once a week (Friday).

----

#### Pros

* Technology tourism
* Cover a lot of subjects/languages
* Networking
* Community (chats / help)
* Learn how others people deal with things

----

#### Cons

###### *“None, but we never finish anyt...”*

(Dojos are not a producing plateform, more a meetup/incubator/innovation/learning lab)

----

#### Example — Kata Arrow

Draw an arrow in the terminal according to the user input:
```
input = 4

   *   
  * *  
 *   * 
*******
   *   
   *   
   *   
   *   
```

----

#### Benefits of the arrow Kata

* Doable in one hour
* Easy concept, constent logic, good to discover new languages
* Already done in 15 languages: 
  `clojure`, `dart`, `go`, `haskel`, `javascript`, `kotlin`, `lua`, `nim`, `perl`, `php`, `python`, `racket`, `ruby`, `rust`, `swift`


----

#### Infos

* Source: https://github.com/epfl-dojo/kata-fleche
* Other kata examples: https://github.com/topics/epfl-dojo-kata

----

#### More

* https://gitlab.com/epfl-dojo
* https://github.com/epfl-dojo


---

<!-- .slide: data-background="https://i.imgur.com/gUHwGSo.jpg" data-id="slide-tips" data-contrast="on" -->

## Tips

What does it take to become a better developer ?
<br />(AKA my 2 cents)

<center><small>Photo by Ashes Sitoula on Unsplash</small></center>


----

## “Learn to read before you write”
![](https://i.imgur.com/go9Ndia.jpg =500x)

<center><small>https://blog.codinghorror.com/learn-to-read-the-source-luke/</small></center>

----

## “Join and participate”

* :heart: Open Source
* https://opensource.guide/
* https://opensourcefriday.com/
* https://www.meetup.com
* LUG (Linux User Group / SwissLinux)
* FIXME (Lausanne Hacker Space)

----

## “Enjoy to move outside your comfort zone”
![](https://i.imgur.com/VycRSl2.jpg =500x)

----

## “Train on personal project”
![](https://i.imgur.com/VLGISHJ.jpg =400x)

→ The best way to get something done is to begin

----

# “Sharing is caring”
![](https://i.imgur.com/x5imEhc.jpg =400x)

→ The learning-by-teaching effect has been demonstrated in [many studies](https://digest.bps.org.uk/2018/05/04/learning-by-teaching-others-is-extremely-effective-a-new-study-tested-a-key-reason-why/). #ProtégéEffect

----

## Ego?
![](https://i.imgur.com/dn36jIA.jpg =500x)

→ There's always someone better than you - ask for help and guidance

----

## “It's OK to make mistakeS”
![](https://i.imgur.com/t9uTSBv.jpg =500x)

→ You don't learn much by doing everything right...

----

## Stackoverflow

![SO >](https://i.imgur.com/TZm3Mn9.png =300x)

 * Get help
 * Give help
 * <span class="more">make reputation</span>

----

## “Keep having fun in learning”

![leeks >](https://i.imgur.com/Q5ULr1G.jpg =200x)

* https://www.codewars.com/
* https://www.root-me.org/
* https://leekwars.com/
* and a tons of other online ressources...

---

<!-- .slide: data-background="https://i.imgur.com/Bw5IYCM.jpg" data-id="slide-attitude" data-contrast="on" -->
## Keep good attitude


<br/>
<center><small>Photo by Yingchou Han on Unsplash</small></center>


---

## About this presentation

* Author: Nicolas Borboën <nicolas.borboen@epfl.ch>
* Presenter: Giovanni Cangiani <giovanni.cangiani@epfl.ch>
* Sources: https://go.epfl.ch/PCSlides2
* How: [hackmd.io](https://hackmd.io/) → [reveal.js](https://revealjs.com)


---

<!-- .slide: data-background="https://i.imgur.com/NkFIAgn.jpg" data-contrast="on" -->
<!-- ![Photo by Ruvim Noga on Unsplash](https://i.imgur.com/NkFIAgn.jpg) -->

## Discuss / AMA / Share

<!-- 
  This style apply by default to all slides, unless .slide is used. 
  Note the use of the reveal class selector: this mean that only the presentation is affected by this style, and the makrdown preview or the book mode of hackmd.io is style intact.
  If you want/need a resizable background image, add the background-size: cover; property and change background-position: 0px 0px; 
-->
<style>
  .reveal {
    background-color: #e6e6e6;
    background-image: url('https://epfl-idevelop.github.io/elements/svg/epfl-logo.svg');
    background-repeat: no-repeat;
    background-position: 5px 5px;
  }
  .reveal {
    color: #707070;
  }
  .reveal h1, .reveal h2, .reveal h3, 
  .reveal h4, .reveal h5, .reveal h6 {
    color: #212121;
  }
  .reveal a {
    color: #f009;
  }
  .reveal a:hover {
    color: #f00;
  }
  .reveal .more {
    color: #339;
  }
  .reveal code {
    padding-top: 0.2em;
    padding-bottom: 0.2em;
    margin: 0;
    font-size: 85%;
    background-color: rgba(255, 255, 255, 0.46);
    border-radius: 3px;
  }
  [data-contrast="on"] > div { 
    background-color: #ffffff94; 
  }
  /* https://stackoverflow.com/a/39614958/960623 */
  img[alt$=">"] {
    float: right;
  }

  img[alt$="<"] {
    float: left;
  }

  img[alt$="><"] {
    display: block;
    max-width: 100%;
    height: auto;
    margin: auto;
    float: none!important;
  }
</style>