├── Backend.md ├── Git.md ├── HTMLCSS.md ├── JavaScript.md ├── MVC.md ├── Networking.md ├── README.md └── graphic-design.md /Backend.md: -------------------------------------------------------------------------------- 1 | # Backend assignment (nodeJS) 2 | 3 | 4 | 5 | **Problem Statement:** 6 | 7 | Your task is to build a Library Management System, which has the following features: 8 | 9 | * A client portal and an admin portal (should include authentication and authorization). 10 | * Admins can list the books available in the library, update that list and approve/deny checkout/check-in requests made by the clients. 11 | * Clients can view the list of books and request admin to checkout/check-in particular books. 12 | * Clients should be able to see the checked out books against their account. 13 | * Passwords should be hashed before storing in the database. 14 | 15 | **Bonus Points:** 16 | 17 | * Read about and implement methods to prevent SQL injection. 18 | 19 | Here are some resources below for further reading: 20 | 21 | * **MySQL:** 22 | * https://www.mysqltutorial.org/mysql-nodejs/ 23 | * https://www.tutorialspoint.com/mysql/index.htm 24 | * https://www.w3schools.com/sql/ 25 | 26 | * **ExpressJS:** 27 | * [https://expressjs.com/en/starter/installing.html](https://expressjs.com/en/starter/installing.html) 28 | * **Hashing:** 29 | * [https://auth0.com/blog/hashing-passwords-one-way-road-to-security/](https://auth0.com/blog/hashing-passwords-one-way-road-to-security/ 30 | ) 31 | -------------------------------------------------------------------------------- /Git.md: -------------------------------------------------------------------------------- 1 | # Git Bash Problem Statement 2 | 3 | The problem statement for Git is divided into 3 tasks: 4 | 5 | **1**. You have to make a bash script which sets your gpg keys for git so that all your future commits can be gpg-signed. 6 | 7 | **2**. Go to [https://gitexercises.fracz.com](https://gitexercises.fracz.com/) and complete the exercises till level "fix-old-typo", including that level. 8 | 9 | **3**. Solve the [Bandit wargame](https://overthewire.org/wargames/bandit/) till level 20. 10 | 11 | **Resources to help you:** 12 | 13 | * Bash Scripting Guide: https://www.javatpoint.com/bash 14 | 15 | * Bash Scripting cheat sheet: https://devhints.io/bash 16 | 17 | * GitHub's Git Guide: https://guides.github.com/introduction/git-handbook/ 18 | 19 | * Git Best Practices: https://github.com/trein/dev-best-practices/wiki/Git-Commit-Best-Practices 20 | 21 | * GPG Signing: 22 | https://docs.github.com/en/github/authenticating-to-github/signing-commits 23 | 24 | https://git-scm.com/book/en/v2/Git-Tools-Signing-Your-Work 25 | 26 | * gitignore templates for easy project setup: https://github.com/github/gitignore 27 | * Atlassian's Git Advanced Tutorials: [https://www.atlassian.com/git/tutorials/advanced-overview](https://www.atlassian.com/git/tutorials/advanced-overview) 28 | * Oh shit git: https://ohshitgit.com/ 29 | * Learning lab by github: https://lab.github.com 30 | * SSH: https://www.digitalocean.com/community/tutorials/ssh-essentials-working-with-ssh-servers-clients-and-keys 31 | * Linux Filesystem: https://youtu.be/HbgzrKJvDRw 32 | -------------------------------------------------------------------------------- /HTMLCSS.md: -------------------------------------------------------------------------------- 1 | # HTML/CSS Problem Statement 2 | 3 | **Problem Statement :** Make your own portfolio using vanilla (i.e., no use of any libraries) HTML and CSS. 4 | 5 | Tasks: 6 | 7 | * Use fonts from Google Fonts. 8 | 9 | * Use flexbox. If you are familiar with flexbox you can use CSS Grids 10 | 11 | * Add CSS based animation and transitions in your website 12 | 13 | * Make your website [responsive](https://www.google.com/search?sxsrf=ACYBGNRfUz3aIEEPXCi0Ul_mi5ULRG9uYg%3A1579713308900&ei=HIMoXse0NsW2rQHl0qjwAg&q=html+responsive&oq=html+responsive&gs_l=psy-ab.3..0i7i30l10.2460.3004..3192...0.2..0.199.673.0j4......0....1..gws-wiz.......0i71.rMyZIh2v6XY&ved=0ahUKEwjHsv7U2pfnAhVFWysKHWUpCi4Q4dUDCAo&uact=5). 14 | 15 | Try to complete as many tasks as you can. Links that you can refer to are given below: 16 | 17 | Lecture slides: http://slides.com/kps/html-css 18 | 19 | HTML/CSS Reference: [https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web ](https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web) 20 | 21 | CSS Reference: https://tympanus.net/codrops/category/tutorials/ 22 | 23 | Flexbox Reference: https://css-tricks.com/snippets/css/a-guide-to-flexbox/ 24 | 25 | CSS Grids Reference: https://css-tricks.com/snippets/css/complete-guide-grid/ 26 | 27 | CSS Media Queries: https://css-tricks.com/css-media-queries/ 28 | 29 | CSS Animations: https://robots.thoughtbot.com/css-animation-for-beginners 30 | 31 | Google Fonts: https://fonts.google.com/ 32 | 33 | Nice read: http://stackoverflow.com/a/27704409 34 | 35 | Frontend inspirations: [https://www.awwwards.com/ ](https://www.awwwards.com/) 36 | 37 | Some portfolios you can refer to: 38 | 39 | * http://ketangupta.in/ 40 | 41 | * http://www.betatakaki.com/ 42 | 43 | * http://www.madebydaryl.co.uk/ 44 | 45 | * http://mrcthms.com/ -------------------------------------------------------------------------------- /JavaScript.md: -------------------------------------------------------------------------------- 1 | # JavaScript Problem Statement 2 | 3 | **Problem Statement:** 4 | 5 | You have to create a game from scratch using the canvas2d API. Following are the expectations from the game: 6 | 7 | 1. Load any kind of game data using AJAX 8 | 2. There must be two types of data storage: A persistent data store (using localStorage) and a non-persistent data store (using sessions). You can figure out what data goes into what type of store, for eg: leaderboard in localStorage and current high score in session. 9 | 3. Use `requestAnimationFrame` for the render loop 10 | 4. At least one keyboard input 11 | 12 | **Brownie points:** 13 | 14 | 1. Store game states separately allowing the user to pause and resume the game anytime 15 | 2. Use WebSockets for multiplayer support 16 | 3. Implement physics and use a separate loop to calculate physics at each frame 17 | 4. Add sounds 18 | 5. Use sprite-sheets to load the in-game assets(character animations, other objects, etc) 19 | 20 | **Rules:** 21 | 22 | 1. Only vanilla JS is allowed 23 | 2. try using free asset websites like [itch.io](http://itch.io/), [kenny.nl](http://kenny.nl/) to get free asset sprite-sheets instead of google images 24 | 25 | **Resources:** 26 | 27 | - Slides: https://slides.com/smithpereira/lecture-on-javascript 28 | - Javascript by [fireship.io](http://fireship.io/) (very fun playlist, and a channel I definitely recommend): https://www.youtube.com/playlist?list=PL0vfts4VzfNixzfaQWwDUg3W5TRbE7CyI 29 | - Playlist on the canvas element (watching all the videos in this playlist is neither recommended nor needed. Just watch the ones that interest you :)) : https://youtube.com/playlist?list=PLpPnRKq7eNW3We9VdCfx9fprhqXHwTPXL 30 | - A nice little video on the internals of JS: https://youtu.be/8aGhZQkoFbQ 31 | - Advanced JS concepts that everyone must know: https://hackernoon.com/12-javascript-concepts-that-will-level-up-your-development-skills-b37d16ad7104 32 | - Basic JS game : https://developer.mozilla.org/en-US/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript 33 | - Cookies vs localstorage : https://medium.com/swlh/cookies-vs-localstorage-whats-the-difference-d99f0eb09b44 34 | - Also, since you are making a game, We'd really recommend giving this video a watch: https://www.youtube.com/watch?v=Fy0aCDmgnxg 35 | 36 | [Here](https://github.com/rohithvarma3000/pingpong) is a submission by a SDSLabs member that you could check out for reference. 37 | -------------------------------------------------------------------------------- /MVC.md: -------------------------------------------------------------------------------- 1 | # MVC assignment 2 | 3 | **Problem Statement** : 4 | 5 | You have to reconstruct the application you built for your Backend assignment using the MVC architecture. 6 | 7 | While doing your MVC assignment keep these things in mind:- 8 | 9 | * A README with setup instructions is compulsory and should have all the steps to set up your project successfully. Brownie points for anyone who automates this process. 10 | * Bonus points will be awarded to those who build a good frontend :p 11 | * Most importantly do not commit files where you have stored your passwords. Add that filename to .gitignore. 12 | * Place the config files (sample vhost file, db username/passwords, etc) in another folder 'config'. 13 | * Make sure your vendor files are not uploaded. 14 | * Again, Write good design. 15 | 16 | **Resources:-** 17 | 18 | * Object Oriented Programming in PHP 19 | \- http://php.net/manual/en/language.oop5.php 20 | \- https://valuebound.com/resources/blog/object-oriented-programming-concepts-php-part-1 21 | \- https://daylerees.com/php-namespaces-explained/ 22 | * Composer 23 | \- https://getcomposer.org/doc/00-intro.md 24 | * MVC concepts 25 | \- https://medium.freecodecamp.org/model-view-controller-mvc-explained-through-ordering-drinks-at-the-bar-efcba6255053 26 | \- https://www.tomdalling.com/blog/software-design/model-view-controller-explained/ 27 | * PDO 28 | \- https://phpdelusions.net/pdo 29 | * ToroPHP 30 | \- https://github.com/anandkunal/ToroPHP 31 | \- How you can write a simple router: http://blogs.shephertz.com/2014/05/21/how-to-implement-url-routing-in-php/ 32 | * twig 33 | \- https://twig.symfony.com/doc/2.x/ 34 | * vhost 35 | \- https://tecadmin.net/create-virtual-hosts-in-apache-on-ubuntu 36 | * mod_rewrite 37 | \- https://code.tutsplus.com/tutorials/an-in-depth-guide-to-mod_rewrite-for-apache--net-6708 38 | 39 | An MVC application for example : https://github.com/sin3point14/mvc-lecture 40 | 41 | If you run into any error, try to resolve the error by yourselves to some extent using these two magic tricks:- 42 | 43 | * var_dump($variable); die() ; 44 | * tail -f /var/log/apache2/mvc.error.log 45 | -------------------------------------------------------------------------------- /Networking.md: -------------------------------------------------------------------------------- 1 | # Networking assignment 2 | 3 | **Problem Statement** : 4 | 5 | Build a SMTP(E-mail) server in C using Berkeley Sockets. It should have the following features:- 6 | 7 | * Ability to send and receive mails over LAN(using IP) 8 | 9 | * Basic frontend for composing and browsing mails 10 | 11 | **Resources:** 12 | 13 | * [All about basics of networking](http://www.aboutdebian.com/network.htm) 14 | 15 | * [Beej's guide to socket programming](http://beej.us/guide/bgnet/) 16 | 17 | * [IP Addressing](http://pages.di.unipi.it/ricci/501302.pdf) 18 | 19 | * [Understanding NAT](https://www.grc.com/nat/nat.htm) 20 | 21 | * [TCP/IP Model](https://technet.microsoft.com/en-us/library/cc958821.aspx) 22 | 23 | * [Basics of TCP IP](https://www.slideshare.net/sanjoysanyal/tcpip-basics) 24 | 25 | * [Router switches and hub](https://www.webopedia.com/DidYouKnow/Hardware_Software/router_switch_hub.asp) 26 | 27 | * [ARP](http://www.erg.abdn.ac.uk/users/gorry/course/inet-pages/arp.html) 28 | 29 | * Computer Networking by Kurose and Ross(Book) 30 | 31 | You can read the "beej guide to socket programming" in the above resources to learn about socket programming in C. An example submission - 32 | 33 | https://github.com/adrijshikhar/smtp-server -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # SDSLabs Problem Statements 2 | 3 | The best way to learn a technology is to get your hands dirty building something with it. We have compiled the problem statements which are given out as internal assignments in SDSLabs here. Hope it helps you learn something new! 4 | 5 | **Development Problem Statements :** 6 | 7 | * [Git Bash](https://github.com/sdslabs/Problem-Statements/blob/main/Git.md) 8 | * [HTML/CSS](https://github.com/sdslabs/Problem-Statements/blob/main/HTMLCSS.md) 9 | * [JavaScript](https://github.com/sdslabs/Problem-Statements/blob/main/JavaScript.md) 10 | * [Backend](https://github.com/sdslabs/Problem-Statements/blob/main/Backend.md) 11 | * [MVC](https://github.com/sdslabs/Problem-Statements/blob/main/MVC.md) 12 | * [Networking](https://github.com/sdslabs/Problem-Statements/blob/main/Networking.md) 13 | 14 | **Design Problem Statements :** 15 | 16 | * [Figma](https://www.notion.so/Figma-Assignment-bee0923dc3f54a75b06cd8d3fc40d201) 17 | * [Graphic Design](https://github.com/sdslabs/Problem-Statements/blob/main/graphic-design.md) 18 | 19 | If you run into any blockers over the course of attempting the problem statements, feel free to ping us at [chat.sdslabs.co](https://chat.sdslabs.co/)! 20 | 21 | -------------------------------------------------------------------------------- /graphic-design.md: -------------------------------------------------------------------------------- 1 | # Graphic Design 2 | 3 | **Problem Statement :** 4 | 5 | **Task 1 :** Trace any character from your favourite anime using illustrator. 6 | **Brownie Points:** We love creativity, so don't stop yourself from giving it your touch! 7 | Tutorial: https://youtu.be/Gu-LOc155kA 8 | 9 | The real Brownie Point : 10 | 11 | **Task 2 :** Design a Soda can for a company. We suggest you come up with the company and can details yourself to avoid same projects. 12 | The design of the soda can can be as simple as a logo and the company name or can be a fun artistic can of the beverage. 13 | PS: If done sincerely you could use this as your branding project! 14 | 15 | Some inspirational projects on the same: 16 | * https://www.behance.net/gallery/77353653/Illustrated-Beers-Cans-Branding-Packaging-Design?tracking_source=search_projects_recommended%7CCan%20Design 17 | * https://www.behance.net/gallery/115971041/LONG-FACE-ICED-COFFEE/modules/661591335 18 | * https://www.behance.net/gallery/98759349/veRve-Energy-Drink-Can-Design?tracking_source=search_projects_recommended%7CCan%20Design 19 | * https://www.behance.net/gallery/117188941/Garden-Boy-Sparkling-Wine?tracking_source=search_projects_recommended%7CCan%20Design 20 | 21 | You might find these a bit too intimidating right now, anyone interested in working on this can freely reach out to us for more details on how to proceed. Trust me it is as simple as drinking the soda :p 22 | 23 | **Resources :** 24 | 25 | * Recommended game for pen tool: https://bezier.method.ac/ - Enjoy the game for mastering over the pen tool! This will teach you what we couldn't :p 26 | * Tutorial on illustrator: https://youtube.com/playlist?list=PLwnXQvUxjbNsvCG_rJJ8vzhbqtEjphKsf 27 | * Tutorial on Photoshop: https://youtube.com/playlist?list=PL7JpMMpENaD3KL_lvmw4eS5U5AD746yKB 28 | We won't recommend you to go through each video but look for the ones you are having trouble with. The best way is always to try making random stuff or art you desire on any of the platforms you like! 29 | 30 | Here is a submission by a SDSLabs member that you could check out for reference : https://www.behance.net/gallery/121814521/Fruzo-Juice-Packaging-Design 31 | --------------------------------------------------------------------------------