diff --git a/app/assets/javascripts/pages.js b/app/assets/javascripts/pages.js new file mode 100644 index 0000000..dee720f --- /dev/null +++ b/app/assets/javascripts/pages.js @@ -0,0 +1,2 @@ +// Place all the behaviors and hooks related to the matching controller here. +// All this logic will automatically be available in application.js. diff --git a/app/assets/stylesheets/components/_markdown.scss b/app/assets/stylesheets/components/_markdown.scss new file mode 100644 index 0000000..9687598 --- /dev/null +++ b/app/assets/stylesheets/components/_markdown.scss @@ -0,0 +1,17 @@ +#preview, #editor { + margin: 20px auto; + max-width: 600px; +} + +#preview { + margin-top: 100px; + min-height: 100px; + border: 1px solid #ddd; + border-radius: 4px; + padding: 6px 12px; + text-align: left; +} + +#preview img { + max-width: 100%; +} diff --git a/app/assets/stylesheets/pages.scss b/app/assets/stylesheets/pages.scss new file mode 100644 index 0000000..0d6878a --- /dev/null +++ b/app/assets/stylesheets/pages.scss @@ -0,0 +1,3 @@ +// Place all the styles related to the pages controller here. +// They will automatically be included in application.css. +// You can use Sass (SCSS) here: http://sass-lang.com/ diff --git a/app/controllers/pages_controller.rb b/app/controllers/pages_controller.rb new file mode 100644 index 0000000..a336ad8 --- /dev/null +++ b/app/controllers/pages_controller.rb @@ -0,0 +1,5 @@ +class PagesController < ApplicationController + def about + + end +end diff --git a/app/helpers/pages_helper.rb b/app/helpers/pages_helper.rb new file mode 100644 index 0000000..2c057fd --- /dev/null +++ b/app/helpers/pages_helper.rb @@ -0,0 +1,2 @@ +module PagesHelper +end diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js index abd76b5..eca5920 100644 --- a/app/javascript/packs/application.js +++ b/app/javascript/packs/application.js @@ -1 +1,5 @@ import 'bootstrap'; + +import { initMarked } from '../plugins/init_marked'; + +initMarked(); diff --git a/app/javascript/plugins/init_marked.js b/app/javascript/plugins/init_marked.js new file mode 100644 index 0000000..2f74ef8 --- /dev/null +++ b/app/javascript/plugins/init_marked.js @@ -0,0 +1,15 @@ +import marked from 'marked'; + +const initMarked = () => { + const textarea = document.getElementById('editor'); + const preview = document.getElementById('preview'); + + if (textarea && preview) { + textarea.addEventListener('keyup', (event) => { + const html = marked(textarea.value); + preview.innerHTML = html; + }); + } +}; + +export { initMarked }; diff --git a/app/views/pages/about.html.erb b/app/views/pages/about.html.erb new file mode 100644 index 0000000..ba82803 --- /dev/null +++ b/app/views/pages/about.html.erb @@ -0,0 +1,14 @@ +
+

+ Markdown => Text +

+
+
+

+ Use the input box below to convert markdown to html 😎 +

+ +
+
+
+
diff --git a/config/routes.rb b/config/routes.rb index 845fdaa..771baad 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -5,4 +5,6 @@ patch "mark" end end + + get "/about", to: "pages#about", as: :about end diff --git a/package.json b/package.json index d1c8828..63445d1 100644 --- a/package.json +++ b/package.json @@ -5,6 +5,7 @@ "@rails/webpacker": "^4.0.7", "bootstrap": "^4.3.1", "jquery": "^3.4.1", + "marked": "^0.6.3", "popper.js": "^1.15.0" }, "devDependencies": { diff --git a/sociology-programming.md b/sociology-programming.md new file mode 100644 index 0000000..bb3e77b --- /dev/null +++ b/sociology-programming.md @@ -0,0 +1,29 @@ +## const Sociology = (student) => { return bootcamp teacher; }. +--- +Back in 2015 I was studying Urban Sociology in Amsterdam. Two months into the year each student had to choose the subject for his or her final thesis. Because I never went abroad during my bachelor or my master, the project group with the location of study being Shenzhen appealed a lot to me. + +Wait what? Shenzhen 🤨, _“what the hell is Shenzhen”_ you might be thinking, this was my first thought at the time as well. Well, Shenzhen is a city in southern China that is home to between 10 and 15 million inhabitants, it borders Hong Kong 🇭🇰 and is one of the many populous areas in the Pearl River Delta. Other Delta notables include Guangzhou and Macau. + +I think it would serve us well to have a good understanding of this city before continuing, so let’s have a brief look at its history. In 1979 the **visionary leader Deng Xiaoping** made a bold step towards **market-oriented reforms** and planned to execute a **capitalist experiment.** A central point to his capitalist experiment was the plan to develop several ***Special Economic Zones.*** These zones were to be considered **training grounds for local talent**, but also to experiment with possible **future economic management systems**. Over the course of three phases, construction, restructuring and re-engineering, the Shenzhen Special economic zone was built up next to Hong Kong. + +Where previously there were small fishing communities totaling an inhabitant’s figure of around 300,000, there now lays an **Asian Megacity** boasting head offices of **Tencent, Huawei** and the factories of **Foxconn** (Yes, those are the lovely people that manufacture your beloved Apple products). All this happened in the over the course of just 35 years. + +Hopefully we now have a better idea of what a **miracle of Chinese state structured** planning Shenzhen is. + +Let’s continue. + +After being introduced to this thesis subject I was sold, my mind was set on visiting Shenzhen. I was accepted to the project group and had to start thinking about my final research question. **Having never been to China**, one of the things that puzzled me was the fact that the **perception of this country I had in my mind**, formed by popular movies and western media, **was not aligned with the way Shenzhen was introduced to me**. I started wondering what made this city special, and more specifically, what made it so attractive for young Chinese people to move there. + +After a few months of preparation, it was **time to do some fieldwork**. So on we went, an interdisciplinary group of 18 students on a 7-week trip to Shenzhen. In between the Bajou and Tsingtao’s I managed to do ***24 interviews and a focus group*** with young Chinese entrepreneurial urbanites. Their businesses ranged from importing wine 🍷, to running a company that produced LEGO-style do it yourself robot building blocks🤖, from being a professional wine taster, to developing an interactive TV remote control. + +I spoke with a very diverse set of human beings and every single one of them was completely different than the media-based assumptions I had about Chinese young people. I expected them to be rigid, hard working people that value the state above personal experience. ___Everything for the collective, Assimilate; We are the Borg.___ On the contrary, they were passionate 🔥, driven, and had a capitalistic mindset which seemed unrivalled by my friends from the western-European cultures I grew up in at large. + +Now don’t get me wrong, I’m not trying to put a subjective valuation on capitalism, implying that it’s a good thing by default. However, the way my respondents __embraced and lived by the capitalist economic model__ as opposed to their __communist heritage__ almost made me believe it is an inherently good thing. + +So there I was, making my way through the urban jungle called Shenzhen, going __from skyscraper to hardware marketplace to winery__, coming out of each interview even more baffled and inspired than the last. Their passion, vast domain specific knowledge, life experiences, and the fact that most of them were __active in the technological scene__ creating hardware and or software made me feel like ___I was missing out on where the magic was happening___. This became most apparent when interviewing an entrepreneur who was enrolled in the Shenzhen Haxlr8r program; a hardware startup incubator. After the interview I had a few minutes to look around the incubator. There were __young people__ on every desk of the incubator. Each of them __talking, building, creating, discussing and pitching__ their products in a virtuous manner. I knew there and then that I wanted/_needed_ to __learn how to code__.👨🏽‍💻 + +Fast forward a few months later. After finishing my thesis and graduating from my Master in Sociology the things I saw in Shenzhen, the people I met there, and the culture I tasted lingered in my subconscious. ___Because of this toe that got dipped in the Shenzhen tech-pool, working as a Sociologist did not seem interesting anymore.___ But how could I ever make my entry into this landscape without any soft- or hardware knowledge? + +Without a clear future plan I kept on working in the same bar I was working in throughout my study. Inspired by my interviews I started a small social enterprise with some friends. Whilst working on this project part-time and part-time in the bar, the stars ✨ and the moon 🌝aligned and I was handed the ___life changing opportunity___ to participate in a ___programming bootcamp___. I did not hesitate and embraced this chance wholeheartedly. I would learn later that this __bootcamp__ would not only train me to acquire the __necessary skill-set__ to make my first steps into the tech-scene, but after gaining some experience as a developer, they would also __offer me the opportunity to work for them as a teacher__ and increase my programming skills exponentially. + +So there you have it, the story of how my ___Sociology degree___ led me __to__ become a programming ___bootcamp teacher.___ diff --git a/yarn.lock b/yarn.lock index 8cb5712..959d3a0 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3925,6 +3925,11 @@ map-visit@^1.0.0: dependencies: object-visit "^1.0.0" +marked@^0.6.3: + version "0.6.3" + resolved "https://registry.yarnpkg.com/marked/-/marked-0.6.3.tgz#79babad78af638ba4d522a9e715cdfdd2429e946" + integrity sha512-Fqa7eq+UaxfMriqzYLayfqAE40WN03jf+zHjT18/uXNuzjq3TY0XTbrAoPeqSJrAmPz11VuUA+kBPYOhHt9oOQ== + md5.js@^1.3.4: version "1.3.5" resolved "https://registry.yarnpkg.com/md5.js/-/md5.js-1.3.5.tgz#b5d07b8e3216e3e27cd728d72f70d1e6a342005f"