Skip to content

Instantly share code, notes, and snippets.

View yangshun's full-sized avatar
😎
Ruining websites since 2013

Yangshun Tay yangshun

😎
Ruining websites since 2013
View GitHub Profile
(() => {
const storySubtitle = $$('.sub.header')[0].textContent;
const storyTitle = $$('h1.header')[0].textContent.replace(storySubtitle, '');
const chapters = [];
[...$$('div[data-reactroot]')[0].children[1].children[0].children[1].children].forEach(chapterEl => {
const chapterObject = { title: null, sections: [] };
const chapterChildren = chapterEl.children[0].children;
chapterObject.title = chapterChildren[0].textContent;

Problems faced by Grab UI

  1. Not possible to have project specific overrides of variables
  2. CSS modules not specific enough to override Grab UI (Semantic UI) classes as CSS modules only apply one class where Semantic UI applies two classes (.ui.) and has higher specificity.
  3. Import theme variables from Grab UI theme configs to use in project-specific components

Requirements

  • No build requirements
  • Small and lightweight
@yangshun
yangshun / eslint-error-formatter.js
Last active June 30, 2018 11:02
Output all the violating rules as an array for turning off and turning on incrementally
module.exports = function (results) {
const rulesFreqs = {};
results.forEach(file => {
file.messages.forEach(message => {
if (!rulesFreqs[message.ruleId]) {
rulesFreqs[message.ruleId] = 0;
}
rulesFreqs[message.ruleId] += 1;
});
});
@yangshun
yangshun / whatsapp_phone_enumerator_floated_div.js
Created May 12, 2017 11:26
PoC WhatsApp enumeration of phonenumbers, profile pics, about texts and online statuses (floated div)
/*
PoC WhatsApp enumeration of phonenumbers, profile pics, about texts and online statuses
Floated div edition
01-05-2017
(c) 2017 - Loran Kloeze - [email protected]
This script creates a UI on top of the WhatsApp Web interface. It enumerates certain kinds
of information from a range of phonenumbers. It doesn't matter if these numbers are part
of your contact list. At the end a table is displayed containing phonenumbers, profile pics,
about texts and online statuses. The online statuses are being updated every
@yangshun
yangshun / using-eslint-with-prettier.md
Last active November 8, 2024 10:21
Comparison between tools that allow you to use ESLint and Prettier together.
prettier-eslint eslint-plugin-prettier eslint-config-prettier
What it is A JavaScript module exporting a single function. An ESLint plugin. An ESLint configuration.
What it does Runs the code (string) through prettier then eslint --fix. The output is also a string. Plugins usually contain implementations for additional rules that ESLint will check for. This plugin uses Prettier under the hood and will raise ESLint errors when your code differs from Prettier's expected output. This config turns off formatting-related rules that might conflict with Prettier, allowing you to use Prettier with other ESLint configs like eslint-config-airbnb.
How to use it Either calling the function in your code or via [prettier-eslint-cli](https://github.co

Connect 4

Connect 4 is a game where two players aim to connect up their pieces to make 4 in a row. Each player takes turn to choose a column to drop their pieces. The first player to connect 4 pieces in a row wins the game. Player 1's pieces are represented by X and Player 2 by O. The game will start with player 1 first. The board dimensions is 6 x 7. Your cli game will have to prompt the user to enter the column number (1-based) that they want to place the next piece in.

.......
.......
.......
@yangshun
yangshun / tic-tac-toe.html
Last active April 28, 2019 19:53
Tic-tac-toe game in Vanilla JS
<!doctype html>
<head>
<style>
body {
font-family: 'Helvetica', sans-serif;
}
.board-cell {
border: 1px solid #666;
box-sizing: border-box;
@yangshun
yangshun / job-hunting.md
Last active October 3, 2024 10:54
Some resources for the job hunting season

Tech Job Hunting

Mock Interview Sites

Would advise you all to practice just for fun. I know a lot of students don't get much practice for interviews.

  • interviewing.io - Allows you to have mock interviews with engineers from the bay area. I personally like this platform a lot and used it as an interviewee.
  • Pramp - Peer-to-peer mock interviews. You get matched with another person, get assigned questions and take turns to be interviewer/interviewee. I personally dislike this platform a lot because I had a horrible experience being matched with some guy who didn't know shit about regular expressions, gave me a wrong test case, and led me down the wrong path of solving the question.
@yangshun
yangshun / mp4-to-mp3.sh
Last active September 18, 2017 02:21
Converts mp4 to mp3 format.
# Place the ffmpeg binary in the same directory.
for video_file in *.mp4
do
audio_file="${video_file/.mp4/.mp3}"
if [ -f "$audio_file" ]; then
echo "$audio_file exists."
else
echo "Converting $video_file to $audio_file."
./ffmpeg -i "$video_file" -vn -sn -c:a mp3 -ab 192k "$audio_file"
fi
let res = '';
$('#question_list tbody tr').each(function () {
const $td = $(this).find('td');
const $link = $($td[2]).find('a').first();
res += `[${$($td[1]).text().trim()} - ${$link.text()}](https://leetcode.com${$link.attr('href')})\n`;
});
console.log(res);