SHAPING THE PAGE II

16:58 Amélie 2 Comments

Hello Friday readers! Bonjour lecteurs du vendredi!

It is now time to see what else we can do to shape and style your page. Today is all about the <style> attribute. We have seven elements to review plus a little bonus or maybe two...

Il est maintenant l'heure de voir ce que nous pouvons faire de plus pour styliser votre page. Aujourd'hui est entièrement consacré à ce que l'on appelle l'attribut <style>. Nous avons sept éléments à étudier ainsi qu'un petit bonus ou peut-être deux...

1. What is the style attribute? Qu'est-ce que l'attribut style?

The 'style' attribute is the key word you need to write between other tags in order to activate it and style the page: <p style="blablabla">

L'attribut 'style' est le mot clef que vous devez écrire à l'intérieur d'autres balises pour pouvoir l'activer et styliser la page: <p style="blablabla">


2. Font size - Taille de police

Very simple combination: <p style="font-size:12px">

p: paragraph
style: indicates an attribute change
font-size: font size change
12: size of the font
px: unit of the size, the pixel

Combinaison assez simple: <p style="font-size:12px">

p: paragraphe
style: indique un changement d'attribut
font-size: changement de la taille de police
12: taille de la police
px: unité de la taille de police, le pixel

3. Colour - La couleur

You can also change the colour. To do so, just replace 'size' by 'color' (US written): <title><h2 style="font-color:red"></title>
You cannot invent the color you want but a list exists so you can refer to it: click here to access

Vous pouvez aussi changer la couleur. Pour se faire, vous n'avez qu'à remplacer 'size' par 'color' (écriture en anglais US): <title><h2 style="font-color:red"></title>
Vous ne pouvez pas inventer la couleur que vous souhaitez mais devez vous référer à une liste qui existe: cliquez ici pour y avoir accès

4. Font family - Type de police

Fancy an original font type? What you need is 'font-family' and the name of the font you want to use: <p style="font-family:arial">

Vous avez envie d'une police originale? Vous aurez besoin de 'font-family' et du nom de la police que vous voudrez utiliser: <p style="font-family:arial">

5. Background - Le fonds 

You can change the background as well if you think white is too boring: <style="background-color:green"> 
The same list of font colours apply to background.

Vous pouvez aussi changer le fonds si vous trouvez que le blanc est vraiment trop ennuyeux: <style="background-color:green">
La liste de couleurs disponibles est la même que pour les polices d'écriture.


6. Text alignment - Justification de texte

You can align your text as you would do in any of the Office pack programs: left, right, centre. Here is the combination: <style="text-align:center">

Vous pouvez aussi aligner votre texte comme dans les programmes du Pack Office: gauche, droite, centre. Voici la combinaison: <style="text-align:center">

7. Your font in bold or italic - Votre police en gras ou italique

Now that we used different attributes to style the font, we can highlight words by putting them in bold and/or italic.
- Bold: <strong></strong>
- Italic: <emphasize></emphasize>

Maintenant que nous avons utilisé différents attributs pour styliser la police, nous pouvons aussi mettre en évidence certains mots en les mettant en gras et/ou italique.
- Gras: <strong></strong>
- Italique: <emphasize></emphasize>

8. What about multiple attributes at the same time? - Et si l'on veut mettre plusieurs attributs en même temps?

Now that you know what style you want to give your page you can write it in one simple tag. 
Let's say I want to write in courier - 22 pixels - black - yellow background and one word in bold: <style="font-family:courier;font-size:22px;font-color:black;background-color:yellow>

The only thing you need to do is add a semi colon between each attribute.

Maintenant que vous savez quel style vous souhaitez donner à votre page, vous pouvez l'écrire en un seul tag très simple. 
Disons que nous souhaitons écrire en courier - 22 pixels - noir - fonds jaune et un mot en gras: <style="font-family:courier;font-size:22px;font-color:black;background-color:yellow>

La seule chose à faire est d'ajouter des points-virgules entre chaque attribut.

code digital program blog coding technology innovation codecademy MIT Londres New York USA Etats-Unis Angleterre London France Paris tech entrepreneur female femme créer entreprise apprendre blog autodidacte on my own technology sillicon valley myself autodidact programmeur programator HTML
Credits: codecademy.com

Bonus 1

Nothing explains better a product, system than a video right? So let's see how we can add one! Difficult one to do (but not too much) ;)
You need to use all the different attributes below to add the video onto your page:
- width/height: sets the size of the screen that displays the video
- controls: adds play, pause, volume
- source src: sets the URL of the video to play
- type: specifies the video format

<video width="320" height="240" controls><source src="video-url.mp4" type="video/mp4"></video>

Rien de mieux qu'une vidéo pour expliquer votre produit, système n'est-ce pas? Regardons maintenant comment pouvons-nous en ajouter une! Difficile à faire (mais pas trop quand même) :)
Vous devez utiliser les différents attributs ci-dessous pour ajouter la vidéo à votre page:
width/height: la largeur et la hauteur de la vidéo
controls: ajoute les boutons play, pause, volume
source src: indique l'URL source de la vidéo
type: indique le format de la vidéo

<video width="320" height="240" controls><source src="video-url.mp4" type="video/mp4"></video>

Bonus 2 #FAIL

Here I come with my first big fail in blogging/HTML!

You may have spotted very weird styles in my articles (you cannot anymore as I changed everything now). Different fonts, sizes, styles... Nothing consistent at all. For those who know me, I am sure you can already picture me very annoyed by this! I like to have the same shape in all the articles (who would not?). 

After I spoke with my friend Beth (who knows how to code and way better than me) and explained her the situation with at least 20 texts (big SMS lover here) and a lot of angry emojis, she told me I made a huge mistake: writing my articles on Word and copy/paste them onto blogger to publish them.
Word does not use a raw text format. What is raw text? It is text in the most simple version, no style and attributes at all. When you copy/paste the text from Word, you will also copy some hidden attributes that will pretty much messes everything up in your HTML code if you are a beginner like me.

End of the story? Not that much. I had to spend 2.5 hours (luckily the Bee Gees were kind to me and played some good music in the background) copying, pasting the articles onto TextEdit-Mac (WordPad-Windows) and put 'Default' in the Style tab so everything went back to normal. Then, pasted the articles back to Blogger and restyled them again.

I hope this made you laugh because I did not! 
I am just happy I could solve the problems myself! 
I am a big believer that you can make mistakes as long as you quickly learn from them and find a solution to solve the problem  ;) 


Me voilà avec mon premier bel échec en blog/HTML!

Vous avez certainement du voir des styles très bizarres dans mes articles (enfin vous ne pouvez plus maintenant car j'ai déjà tout changé). Des polices, tailles et styles différents... Rien de consistant. Pour ceux qui me connaissent, je suis sûre que vous me voyez déjà très ennuyée par ce problème! J'aime avoir le même style dans tous mes articles (qui ne voudrait pas d'ailleurs?).

Après avoir discuté avec mon amie Beth (qui sait coder et beaucoup mieux que moi) et lui avoir expliqué la situation avec au moins 20 messages (je voue une passion à l'envoi multiple de SMS) et pas mal d'emojis pas très contents, elle m'a indiqué que j'avais fait une erreur assez grossière: écrire mes articles sur Word et les copier/coller sur Blogger pour ensuite les publier.
Word n'utilise pas de texte brut. Qu'est-ce que tu le texte brut me direz-vous? Ce sont des mots dans leur version la plus simpliste avec aucun style et sans aucun attribut. Lorsque vous copiez/collez le texte de Word, vous copierez aussi des attributs cachés qui mettront le bazar partout dans votre code HTML si vous êtes un débutant comme moi.

Fin de l'histoire? Pas vraiment. J'ai passé 2.5 heures (heureusement que les Bee Gees étaient là à jouer de la bonne musique dans le fonds) à copier, coller les articles sur TextEdit-Mac (WordPad-Windows) et mettre 'Défault' dans l'onglet Style afin que tout redevienne normal. Et ensuite, j'ai recollé les articles dans Blogger et les ai restylisés.

J'espère que cette petite histoire vous aura fait rire car moi pas!
Je suis juste contente d'avoir pu résoudre le problème moi-même! 
Je suis plutôt partie prenante de faire des erreurs du moment qu'on apprend rapidement d'elles et que l'on trouve des solutions au problème ;)

Here you are for today! Come back next week for new discoveries on trends and how to code in HTML. Have a lovely weekend!

Et voilà pour aujourd'hui! Revenez la semaine prochaine pour de nouvelles découvertes sur les tendances et comment coder en HTML. Passez un excellent week-end!

To be continued in the next episode, Amélie X
La suite au prochain épisode, Amélie X

2 commentaires:

SHAPING THE PAGE I

19:30 Amélie 0 Comments

Hello everyone,

Long time no speak right? Well, I am back now!

If you remember last time, I introduced you to how to shape the page with <head>, <title>, <body> and <p>. You can obviously do more than this simple distinction between each section and add a little twist to it!
Today, I wanted to show you four elements that will help you shape and style your page: title size, text link, image link, lists.

Bonjour tout le monde, 

Cela faisait longtemps que l'on ne s'était pas vu n'est-ce pas? Et bien je suis de retour maintenant!

Si vous vous souvenez de la dernière fois, je vous avais introduits sur la mise en page avec <head>, <title>, <body> et <p>. Vous pouvez bien sûr faire plus que cette simple distinction entre chaque section et y ajouter un peu plus de cachet!
Aujourd'hui, je voulais vous montrer quatre éléments qui vous aideront à donner forme et style à votre page: taille du titre, lien de texte, lien d'image, listes.

Title Size - Taille du Titre

You can give your title six different sizes: 1 is the biggest and 6 the smallest.
To do so, you need to insert the size it in your title’s tags as shown below:

<title><h1>Hello</title>
<title><h6>Hello</title>

Vous pouvez donner six tailles différentes à votre titre: 1 étant la plus grande et 6 la plus petite.
Pour faire ceci, vous devez ajouter la taille que vous désirez à l'intérieur des crochets du titre. Je vous montre ci-dessous comment procéder:

<title><h1>Hello</title>
<title><h6>Hello</title>

code digital program blog coding technology innovation codecademy MIT Londres HTML New York USA Etats-Unis Angleterre London France Paris tech entrepreneur female femme créer entreprise apprendre blog autodidacte on my own technology sillicon valley myself autodidact programmeur programator codecademy title size
Credits: codecademy.com

Text Link - Lien de Texte

What about creating links in your page?
When you surf on a website you always click on something that redirects you to something else on another page. This is called a link. Again, if you are a good user of the Office pack, you must know the little trick ctrl+k or cmd+k. When highlighting a word/piece of text you can nest an URL in it in order to avoid the ugly look of a long URL link in an email for example.

It is a bit complicated as you need to use two tags that are nested into each other:

<a></a> are the link tags that will enable you to redirect the clicker to somewhere else. It is the piece of text that will appear on the screen and contain the link. It is when clicking on that text that you will be redirected to the web page that has been given as a target/destination to href
<href> is the destination's URL where you want to send that person to

Sounds like a bit complicated? Follow the steps below to better understand the concept:

Text: I am French
URL: http://www.nytimes.com/2014/11/11/opinion/how-to-be-french.html?_r=0
HTML: I am <a href=”http://www.nytimes.com/2014/11/11/opinion/how-to-be-french.html?_r=0">French</a>

- Code is on line 4 -


> Do not forget to add the equal sign at the beginning and the inverted commas at the beginning and at the end of the URL

Et si l'on créait des liens sur votre page?

Quand vous naviguez sur un site internet vous cliquez toujours sur quelque chose qui vous redirigera vers un autre endroit sur une autre page. Cela s'appelle un lien. Encore une fois, si vous êtes un bon utilisateur du pack Office vous devez être familier avec l'astuce du raccourci de lien ctrl+k ou cmd+k. En effet, quand vous surlignez un mot ou un morceau de texte vous pouvez y intégrer un lien URL pour éviter l'horrible vision d'un long lien URL dans un email par exemple.

C'est un peu compliqué car vous devez utilisez deux systèmes de balises qui sont imbriquées l'une dans l'autre:


<a></a> sont les balises de lien qui vous permettront de rediriger la personne qui clique vers un autre endroit. C'est le texte qui apparaitra sur votre écran et qui contiendra le lien. C'est lorsque vous cliquer sur ce texte que vous serez redirigé sur la page internet qui a été donnée comme cible/destination à href
<href> l'URL de destination où vous désirez renvoyer la personne

Cela semble un peu biscornu? Suivez les étapes ci-dessous pour mieux comprendre le concept:

Texte: I am French

URL: http://www.nytimes.com/2014/11/11/opinion/how-to-be-french.html?_r=0
HTML: I am <a href=”http://www.nytimes.com/2014/11/11/opinion/how-to-be-french.html?_r=0">French</a>

- Le code est sur la ligne 4 - 

> N'oubliez pas de mettre le signe égal au début et les guillemets au début et à la fin de l'URL



code digital program blog coding technology innovation codecademy MIT Londres New York USA Etats-Unis Angleterre London France Paris tech entrepreneur female femme créer entreprise apprendre blog autodidacte on my own technology sillicon valley myself autodidact programmeur programator HTML
Credits: codecademy.com

Image Link - Lien d'Image

You can also create a link through a picture.
A typical case of execution is when you are shopping online. I see something I fancy (those New Balance shoes spotted on Asos) and decide to click on the picture to know more about it. It redirects me to the product description.
Let’s see how we do this one. Beware! It adds a little bit of difficulty to the previous combination.
Vous pouvez aussi créer un lien sur une image.

Un cas typique d'exécution est lorsque vous achetez en ligne. Je vois quelque chose qui me plait (ces New Balance que j'ai repérées sur Asos) et décide de cliquer sur l'image pour en savoir un peu plus. Cela me redirige sur la description produit.
Regardons comment faire pour le lien d'image. Attention! Cette combinaison est un peu plus difficile que la précédente.


code digital program blog coding technology innovation codecademy MIT Londres New York USA Etats-Unis Angleterre London France Paris tech entrepreneur female femme créer entreprise apprendre blog autodidacte on my own technology sillicon valley myself autodidact programmeur programator HTML asos New Balance shoes shoe fashion mode basket tennis chaussures chaussure
Credits: asos.com
code digital program blog coding technology innovation codecademy MIT Londres New York USA Etats-Unis Angleterre London France Paris tech entrepreneur female femme créer entreprise apprendre blog autodidacte on my own technology sillicon valley myself autodidact programmeur programator HTML asos New Balance shoes shoe fashion mode basket tennis chaussures chaussure
You need the elements below:

<img> is the image tag as for <a>, a text tag
<src> source is equivalent to <href> which will indicate where to find the picture

Image: my picture on my LinkedIn profile
Image's URL: https://media.licdn.com/mpr/mpr/shrink_100_100/AAEAAQAAAAAAAActAAAAJDEwY2M5MDZkLThmNDYtNDhhNy1hYjFmLTlkYTQxMzlkN2FhYg.jpg

Destination: my LinkedIn profile

LinkedIn profile URLPublic Profilehttps://fr.linkedin.com/in/amelielefebvre

<a href=“link to where I want the person to land on”<img src=”image’s URL”></a>
<a href=“Public Profilehttps://fr.linkedin.com/in/amelielefebvre”<img src=”https://media.licdn.com/mpr/mpr/shrink_100_100/AAEAAQAAAAAAAActAAAAJDEwY2M5MDZkLThmNDYtNDhhNy1hYjFmLTlkYTQxMzlkN2FhYg.jpg”></a>

Vous avez besoin des informations suivantes:

<img> la balise de l'image comme la balise <a> pour le texte
<src> correspond à source qui équivaut à la balise <href> qui indiquera où trouver l'image

Image: la photo de mon profil LinkedIn
URL de l'image: 
https://media.licdn.com/mpr/mpr/shrink_100_100/AAEAAQAAAAAAAActAAAAJDEwY2M5
MDZkLThmNDYtNDhhNy1hYjFmLTlkYTQxMzlkN2FhYg.jpg

Destination: mon profil LinkedIn
URL de mon profil LinkedIn: Public Profilehttps://fr.linkedin.com/in/amelielefebvre

<a href=“link to where I want the person to land on”<img src=”image’s URL”></a>
<a href=“Public Profilehttps://fr.linkedin.com/in/amelielefebvre”<img src=”https://media.licdn.com/mpr/mpr/shrink_100_100/AAEAAQAAAAAAAActAAAAJDEwY2M5MDZkLThmNDYtNDhhNy1hYjFmLTlkYTQxMzlkN2FhYg.jpg”></a>


code digital program blog coding technology innovation codecademy MIT Londres New York USA Etats-Unis Angleterre London France Paris tech entrepreneur female femme créer entreprise apprendre blog autodidacte on my own technology sillicon valley myself autodidact programmeur programator HTML
Credits: codecademy.com

Lists - Listes

You find your page a bit messy and would like to create lists in order to make it clearer. What would you use for that? Bullet points of course!
A bit easier than the two previous ones, the tags are shown below:

Vous trouvez votre page un peu en désordre et voulez créer des listes pour que cela soit plus clair. 
Première option: Je veux que ma liste soit organisée et chiffrée


Que pouvez-vous utiliser pour y arriver? Des puces bien sûr!
Plus facile que les deux combinaisons précédentes, les balises sont ci-dessous:

First option: I want my list to be organized and have numbers in front of each line
<ol></ol> stands for Organized List
<li></li> tags that enable to mark out each point of the list

Let’s create a list of the steps I follow to write my posts:
<ol>
<li>Write what I want to share in English</li>
<li>Find the pictures I want to share</li>
<li>Translate in French</li>
<li>Read again to spot mistakes</li>
<li>Publish the post</li>
</ol>

Première option: Je veux que ma liste soit organisée et chiffrée
<ol></ol> correspond à Organized List (Liste Organisée)
<li></li> balises qui permettront de repérer chaque ligne de la liste

Créons une liste qui permet de suivre les étapes d'écriture de mes articles:
<ol>
<li>Ecrire ce que je veux partager en anglais</li>
<li>Trouver les images que je veux partager</li>
<li>Traduire en français</li>
<li>Relire pour repérer des erreurs</li>
<li>Publier l'article</li>
</ol>

code digital program blog coding technology innovation codecademy MIT Londres New York USA Etats-Unis Angleterre London France Paris tech entrepreneur female femme créer entreprise apprendre blog autodidacte on my own technology sillicon valley myself autodidact programmeur programator HTML
Credits: codecademy.com
code digital program blog coding technology innovation codecademy MIT Londres New York USA Etats-Unis Angleterre London France Paris tech entrepreneur female femme créer entreprise apprendre blog autodidacte on my own technology sillicon valley myself autodidact programmeur programator HTML
Credits: codecademy.com
Second option: I just want to draw a random list with bullet points
<ul></ul> stand for Unorganized List
<li></li> tags that enable to mark out each point of the list

What you need to learn how to code:
<ul>
<li>A computer or a laptop</li>
<li>A notepad and a pen</li>
<li>Motivation</li>
<li>Patience</li>
</ul>

Deuxième option: Je veux juste créer une liste avec des puces
<ul></ul> correspond à Unorganized List (Liste Non Organisée)
<li></li> balises qui permettront de repérer chaque ligne de la liste

Ce dont vous avez besoin pour apprendre à coder:
<ul>
<li>Un ordinateur</li>
<li>Un cahier et un stylo</li>
<li>De la motivation</li>
<li>De la patience</li>
</ul>

code digital program blog coding technology innovation codecademy MIT Londres New York USA Etats-Unis Angleterre London France Paris tech entrepreneur female femme créer entreprise apprendre blog autodidacte on my own technology sillicon valley myself autodidact programmeur programator HTML
Credits: codecademy.com
code digital program blog coding technology innovation codecademy MIT Londres New York USA Etats-Unis Angleterre London France Paris tech entrepreneur female femme créer entreprise apprendre blog autodidacte on my own technology sillicon valley myself autodidact programmeur programator HTML
Credits: codecademy.com
To be continued in the next episode, Amélie X
La suite au prochain épisode, Amélie X

0 commentaires:

WHAT'S NEW ON TECH EP. 1

18:02 Amélie 0 Comments

Happy Thursday readers! Joyeux Jeudi à tous!

Today, I wanted to talk about two topics I love: coding/technology/programming and trends/entrepreneurship. Behind each project and program there is a code. That is an absolute requirement as everything digitally structured would not work without it.
I am showing you below two concrete applications of Why coding is becoming so important in everyone's life, whether you are coding or using it without knowing.

Aujourd'hui, je souhaitais partager avec vous deux sujets qui me passionnent: le code/la technologie/a programmation et les tendances/l'entreprenariat. Derrière chaque projet et programme existe un code. C'est un pré-requis absolu car tout ce qui est digital ne pourrait fonctionner sans l'application de celui-ci.
Je vous montre ci-dessous deux applications concrètes de Pourquoi le code est devenu si important dans la vie de tous les jours, que vous codiez ou que vous l'utilisiez sans le savoir.

1. La Roche-Posay MY UV Patch - Mon Patch UV de La Roche-Posay

Who is La Roche-Posay? - Qui est La Roche-Posay?

La Roche-Posay is a thermal city situated in France but also a dermatological laboratory that belongs to the L'Oréal Group. Its aims is to to retail products that will take care of your skin, whether it is problematic or not. It is mid-step between 'normal' cosmetics product and prescribed medication. 

La Roche-Posay est une ville thermale située en France mais aussi un laboratoire dermatologique appartenant au Groupe L'Oréal. Son but est de vendre des produits qui prendront soin de votre peau, qu'elle soit problématique ou non. C'est à mi-chemin entre les cosmétiques 'normaux' et ceux sur prescription médicale.

code digital program blog coding technology innovation codecademy MIT Londres New York USA Etats-Unis Angleterre London France Paris tech entrepreneur female femme créer entreprise apprendre blog autodidacte on my own technology sillicon valley myself autodidact programmeur programator Anthelios Roche-Posay L'Oréal suncare sunscreen crème solaire protection patch UV UVA UVB new trend
Credits: L'Oréal / La Roche-Posay
What is My UV Patch and how does it work? - Qu'est-ce que Mon Patch UV et comment fonctionne-t-il?

La Roche-Posay showcased their brand new My UV Patch back in January at the CES (Consumer Electronics Show) and it has just hit retail. The patch has been developed in association with Massachusetts based MC10 and looks like a tiny summery heart-shaped tattoo. You stick it on the back of your hand (most accurate position) where sun rays will hit it. 
The tattoo contains a photosensitive captor that will change colour telling you when to protect yourself.
You can also link the patch to your smartphone. Shoot the sticker and your phone will automatically open an app where you can look after the instant and cumulative amount of UV rays you have been exposed to.
You can have it for free when you buy one of their sun care products from the Anthelios range.

La Roche-Posay a dévoilé son tout nouveau patch Mon Patch UV en janvier dernier lors du CES (Consumer Electronics Show) et il vient juste d'arriver en boutique. Le patch a été développé en association avec l'entreprise MC10 basé dans le Massachusetts et ressemble à un petit tatouage en forme de coeur. Vous le collez sur le dos de votre main (endroit le plus approprié) là où les rayons du soleil pourront l'atteindre.
Le tatouage contient un capteur photosensible qui changera de couleur pour vous indiquer quand vous protéger. Vous pouvez aussi lier le patch à votre téléphone. Prenez en photo l'autocollant et votre téléphone ouvrira automatiquement une application où vous pourrez observer votre quantité instantanée et cumulative d'exposition aux rayons UV.
Vous pouvez l'obtenir gratuitement quand vous achetez un produit solaire de la gamme Anthelios.

code digital program blog coding technology innovation codecademy MIT Londres New York USA Etats-Unis Angleterre London France Paris tech entrepreneur female femme créer entreprise apprendre blog autodidacte on my own technology sillicon valley myself autodidact programmeur programator Anthelios Roche-Posay L'Oréal suncare sunscreen crème solaire protection patch UV UVA UVB new trend
Credits: La Roche-Posay / L'Oréal
What technologies/codes are being used? - Quelles technologies/codes sont utilisés?
  • NFC (Near Field Communication): more powerful than RFID (Radio Frequency Identification - it reminds me my logistics courses ;), it allows an electronics tool to communicate with your smartphone automatically when you approach it (you do not need Wifi or Bluetooth). The phone and the other device will communicate to each other and make it happen. Amazing right?
  • Code: here it comes! Your phone would not show a screen with content without having the power of code behind. It is available for iOS and Android
  • NFC (Near Field Communication, Communication dans un Champ Proche): plus puissante que la RFID (Radio Frequency Identification, Identification par Radio Fréquence, cela me rappelle mes cours de logistique ;), elle permet à un appareil électronique de communiquer avec votre smartphone quand vous l'approchez de celui-ci (pas besoin de Wifi ou de Bluetooth). Le téléphone et la pièce émettrice communiqueront ensemble et feront fonctionner l'application. Magique non?
  • Code: nous y voilà! Votre téléphone ne vous montrerez pas un écran avec du contenu sans qu'il y ait le pouvoir du code derrière. L'application a été développée pour iOS et Android



2. I am an entrepreneur, do I need to know how to code and program? The answer is YES! - Je suis un entrepreneur, dois-je apprendre à coder et programmer? La réponse est OUI!

What? - Quoi?

The other day, a great friend of mine sent me this article which is a testimony of two French entrepreneurs and published in Les Echos, a French economical publication. The article is in French but again, Google Translate should help you and I will explain the core of the article here.

L'autre jour, un très bon ami à moi m'a envoyé cet article témoignage de deux entrepreneuses françaises publié dans Les Echos, une parution économique française.


code digital program blog coding technology innovation codecademy MIT Londres New York USA Etats-Unis Angleterre London France Paris tech entrepreneur female femme créer entreprise apprendre blog autodidacte on my own technology sillicon valley myself autodidact programmeur programator lokora
Credits: Charlotte Serre & Lucie Galichon - lesechos.fr
Their story - Leur Histoire

Charlotte Serre et Lucie Galichon are two entrepreneurs who graduated from French Top Schools. Charlotte has a diploma in Project Management from Les Mines de Paris and Lucie studied Electricity Engineering and Finance with a double diploma from Supélec and ESCP Europe. 
After they worked for companies, they decided they wanted to become entrepreneur. 
To do so, they launched their startup called Lokora. Its aim is to help landlords finding new renters when the current's are about to leave. Why would you pay a Real Estate Agency when your current tenants could do the job for you? This is a win-win situation. People who are currently renting will be paid to tour the flat/house and find newcomers to replace them.

Charlotte Serre et Lucie Galichon sont deux entrepreneuses diplômées de Grandes Ecoles françaises. Charlotte est diplômée en Gestion de Projet des Mines de Paris et Lucie a étudié l'Ingénierie Electrique et la Finance lors d'un double cursus Supélec-ESCP Europe. 
Après avoir travaillé pour des entreprises, elles ont décidé d'embarquer pour l'aventure de l'entreprenariat.
Pour faire ceci, elles ont lancé leur startup appelée Lokora. Son but est d'aider les propriétaires à trouver de nouveaux locataires quand les actuels sont sur le point de partir. Pourquoi devriez-vous payer une agence locative quand vos locataires actuels peuvent faire le travail pour vous? C'est une situation de gagnant-gagnant. Les occupants actuels seront payés pour faire les visites et trouver de nouveaux remplaçants.


code digital program blog coding technology innovation codecademy MIT Londres New York USA Etats-Unis Angleterre London France Paris tech entrepreneur female femme créer entreprise apprendre blog autodidacte on my own technology sillicon valley myself autodidact programmeur programator lokora
Credits: lokora.co
Why did they have to learn code and programming? - Pourquoi devaient-elles apprendre le code et la programmation?

They could have created the website using a 3rd-party developer but this would have implied the followings: costs, lot of conversations to improve the platform as soon as clients would have fed back them and not having the total control of your own daily work tool.
They did not need more to decide that they had to learn code and programming in order to manage the situation!

Elles auraient pu créer leur site en faisant appel à un développeur mais cela aurait impliqué les choses suivantes: coûts, beaucoup de conversations et d'allers-retours pour améliorer le site dès qu'elles auraient eu reçu les premiers retours clients et ne pas avoir le contrôle total de leur outil de travail quotidien.
Elles n'avaient pas besoin de plus pour décider qu'il fallait qu'elles apprennent à coder et programmer pour maitriser la situation!

How did they do and what do they think of their new skills? - Comment ont-elles fait et que pensent-elles de leurs nouvelles compétences?

Charlotte and Lucie decided to enroll at Le Wagon for a 9-week intensive course to learn all the competencies they needed to have for their newly created company. They said it was intense and hard but it was worth it as they use their new skills to work on their website but also on side projects to finance their start-up.
They love to know how to code and could not have imagined how creative it was. Plus, they are now more autonomous with their website platform and are in a better shape to set up their ideas calling other competencies.

Charlotte et Lucie ont décidé de s'inscrire au Wagon pour une formation intensive de neuf semaines pour apprendre toutes les compétences dont elles avaient besoin pour leur toute nouvelle entreprise. Cela fut intense et dur mais le jeu en valait la chandelle car elles peuvent utiliser leurs nouveaux savoirs pour travailler sur leur site mais aussi faire des projets à côté qui leur permettent de s'auto-financer et d'investir dans leur start-up.
Elles apprécient énormément le fait de savoir coder et n'auraient pas imaginé une seule seconde à quel point cela était créatif. De plus, elles sont maintenant plus autonomes avec leurs plateformes web et dans une meilleure position pour mettre en place des idées qui font appel à d'autres de leurs compétences.

code digital program blog coding technology innovation codecademy MIT Londres New York USA Etats-Unis Angleterre London France Paris tech entrepreneur female femme créer entreprise apprendre blog autodidacte on my own technology sillicon valley myself autodidact programmeur programator wagon tech school
Credits: lewagon.com

Still need convincing? Get on coding right now :)
Next Monday will be my progress in HTML learning.

Toujours besoin d'arguments? Mettez-vous au code dès maintenant :)
Lundi prochain sera sur mon progrès dans l'apprentissage du HTML.

To be continued in the next episode, Amélie X 
La suite au prochain épisode, Amélie X 

0 commentaires: