======== 2018 Website Redesign ======== =======Contact and Code Locations ======= **Slack Channel Link:** https://lugatuic.slack.com/messages/CCNQX7UJU/ \\ **Github Link:** https://github.com/lugatuic/lug.cs.uic.edu-2018\\ =======Persons Involved ======= ^ Position ^ Name ^ Email ^ ^ **Project Oversight:** | Bennett Maciorowski (LUG President) | bennettmaciorowski@gmail.com | ^ **Project Lead/Manager:** | Joshua Castor (Senior Technical Officer) | joshua.castor@joshuacastor.me | ^ **Project Back End Lead:** | Will Toher | N/A | ^**Project Front End Lead:** | Joshua Castor (Senior Technical Officer) | joshua.castor@joshuacastor.me | ^**Deployment Lead:** | Bharat Middha (LUG VP/SysAdmin) | N/A | **Team Members:** Bennett Maciorowski, Bharat Middha, Brent Yurek,Ghost (need to put real name),Jacob Raffe, Joshua Castor,Stephen Walden, Tejaswi Reddy Kondammagari, Will Toher \\ \\ **Tech Stack Used:** Python Flask, Vue.js, Html, CSS \\ \\ =======Documentation ======= ===== Front End Documentation===== \\ \\ =====Back End Documentation===== \\ ===== Deployment Process===== \\ \\ \\ ======= Meeting Notes ======= ===== Meeting 1 [Sept 12 2018]===== Website design meeting - Sept 12 2018 * Attendees: Bennett Macioroski, Bharat, Brent, Joshua Castor, Jason, Marco (left early), Michelle, Will T, (late), Tian Z (late), Dan H (late) * Topic: Website Redesign * Current Site * Looks old * Data is outdated * Via PHP, no CMS * no more IRC * old Google Calendar widget looks old * things to keep * slack URL * mailing list, location * LUG email * Wants for new site * ability to register online * preferably, proper form, database, etc. * application is ready (via Bharat) * streamlined mailing list sign up process * want CMS (Content Management System) * Drupal or Wordpress * Or homebrewed * relevant info should be front and center * events, officers, room location, available utilities * events: custom calendar widget * livestream of 3D printer * look more "modern" * current site seems a bit blank, maybe larger images to fill page space * not white pages * dark theme * analytics * ACM Member application * long ass form * Available Infrastructure (Chase Lee) * Make Containers * Clusters of servers * 22TB of space * Site Tracking, GDPR (if necessary) * Josh's Proposal: VueJS (JavaScript, HTML, CSS) * pros * Can have Server Side Rendering * MEVN stack * cons * merged with Bharat * **Ben's Proposal: HTML, Flask (Python), Docker, Nginx, UWSGI, Jenkins** * pros * most have some experience with Python * cons * why not DJango? Ben has more experience with Flask * vote: Brent, Ben, Tian (with Vue as frontend), (and Will Toher) * Will Toher * Jenkins is very complicated CI in his opinion, but also one of the better self hosted * Bharat's Proposal: Vue, NodeJS, MariaDB (MySql), Yarn, Docker, Mocha/Chai/Jenkins, Redis, Nginx, Sass * pros * "the new hip thing" * cons * vote: Bharat, Josh * Chase: I <3 PHP, no Ruby * also: Angular, PHP - backend, Laravel, MariaDB (MySql), Yarn, Docker, Mocha/Chai/Jenkins, Redis, Nginx/Apache, Sass * vote: Chase, Dan H. * next meeting * 2 weeks (Sept 26) ===== Meeting 2 [September 26th]===== # pre meeting notes * talk about... * look and feel of new site * content of site * setting up Docker * Splitting up people into teams * review of procedure for pushing code and branches (i.e. logistics, not exact process) * agenda * mention flask-vue concept - 5-10 minutes * branch off into... (tentative order) * docker and backend (first, as it's probably quick) - 5 minutes * who's going to set it up * who's working on it * Github organization and logistics - 5 minutes * splitting into teams - 10-15 minutes * tentatively * main project manager for frontend (probably Joshua Castor) * main project manager for backend (probably Bharat) * UAT person (probably Stephen Walden) (a.k.a. QuailAss person) * User Acceptance Testing * split by tab/page (TBD after discussing look and feel of site) * discussing look and feel of new site (main part of meeting) - time permitting, may move to separate meeting, maybe Monday, 10/1? * CSS frameworks (if any) * what are main tabs/pages -> split frontend people into teams * content per tab/page * color theme(s) * page layout(s) # meeting * brief app walkthrough (https://github.com/BluuArc/LUG-Flask-Vue-Example) * Content Management Systems * Goal: Make it easy to create, edit, and notify people of posts * 3rd party * Drupal (complicated, but more powerful than Wordpress according to Bharat) * Wordpress (easiest according to Bharat) * Make our own? * Not worth it in terms of maintainability (Chase) * DevOps (Docker, CI/CD, etc.) * Bharat and Chase * GitHub Team for Web Redesign * https://github.com/orgs/lugatuic/teams/website-redesign/members * You should be able to log in and see your name on the list * If not, message Ben or Bharat to add you * GitHub Repo organization * Based on https://www.atlassian.com/git/tutorials/comparing-workflows/gitflow-workflow * Don't push to master (CI/CD will do that), use develop * Use feature branches * Splitting into teams * DevOps - Bharat * Backend - Ben * Frontend - Josh * Current Plan * leaders create tasks * each team can then run their own meetings separately * To readers: Pick up issues, you're not tied to a specific team, ask leader for more info * Idea: dump old slack messages and post them * Look into accessibility * Tentatively have look and feel meeting on Monday, Oct 1. Need to figure out optimal time * quick brainstorming session * Projects page * Wiki page * Membership registration form * Event Gallery * Event Page (current and future) * Officers page, w/ record of officers * Home/Splash Page * 3D livestream * Contact Us ===== Meeting 3 [October 4th 2018]===== # pre meeting notes\\ * talk about... * look and feel of new site * content of site * Splitting up people into teams * agenda * discussing look and feel of new site (main part of meeting) - time permitting, may move to separate meeting, maybe Monday, 10/1? * CSS frameworks (if any) * what are main tabs/pages -> split frontend people into teams * content per tab/page * color theme(s) * page layout(s) * split by tab/page (TBD after discussing look and feel of site) * quick brainstorming session from last meeting * Projects page * Wiki page * Membership registration form * Event Gallery * Event Page (current and future) * Officers page, w/ record of officers * Home/Splash Page * 3D livestream * Contact Us # meeting * navigation bar * permanent left menu with pages (potentially collapsible on smaller screens - need testing) * see https://vuetifyjs.com/en/framework/icons for reference * collapsible subpages * category listings * Home * Events * Projects * Project Listing * Wiki Page * Services * About Us * AppBar * top right * sign up * slack * top left * menu icon (on smaller devices only) * icon/logo * move logo to side menu on smaller screens * pages * Projects page * record of projects * Wiki page * Membership registration form * Events * tile + thumbnail listing * sort newest first by default, search functionality * bare minimum: link to Google Calendar widget embed * Event Gallery of previous events * Event Listing (current and future) * Home/Splash Page * pictures of recent events - carousel - higher target * office location * link to Slack channel * LUG description (Lorem ipsum filler) * sign up form/button/link * 3D livestream * Contact Us * Question page - post question functionality * About Us * who we are * Officers page/listing, w/ record of officers * each officer has their own tile, with description and contact info * Design Decision: Using [Vuetify](https://vuetifyjs.com/en/) framework for components * stretch goal: konami code on front page for bonus theme * logo only * black background * green primary color * stereotypical console font (e.g. Consolas) * Action Items for next meeting (TBA) * Josh: create mockup of site * Others on frontend: brush up on Vue\\ ===== Meeting 4 [October 23rd 2018]===== * agenda * go over PR * decide whether to keep layout * if we keep the layout, start creating issues * if not, brainstorm more layout * sign up button * start with Google Form * potentially revisit later on to implement our own form * home page * top banner * hardcoded * about section * hardcoded * left half: description * right half: location * event carousel * API for event data * 1 entry at a time * each entry contains * title * desc * possible image * timing * officer cards * API for officer listing * each card * game card style * top: name * image * position * bio * special abilities * utilties listing (cards?) * hardcoded * easter egg: visiting pages in a specific order leads to a specific page * GitHub issues will start showing up sometime over the next few days\\ ===== Meeting 5 [October 30th 2018]===== * agenda * define API for structures of officers and events * [Officer issue](https://github.com/lugatuic/lug.cs.uic.edu-2018/issues/11) and [events issue](https://github.com/lugatuic/lug.cs.uic.edu-2018/issues/7) * workshop on issues * front page cricisms * on light theme, there's a gray bar in the event carousel; there was a suggestion to remove it * on dark theme, color highlighting the active page on the left sidebar doesn't have enough contrast; there was a suggestion to change it * Officer API * endpoint: `/api/officers?semester=fa2018` * returns array of officers * `semester` - define what semester to show officers for * if not specified, returns all officers * e.g. `/api/officers?semester=fa2018` returns an array of officers for Fall 2018 * one officer object {"name": "officer name", "rank": "some rank", "desc": "description of officer, just plaintext", "github": "github link", "personal_site": "link to personal", "image": "image link, if needed", "special_ability": "a special ability", "join_date": "a date object" } * Events API * endpoint: `/api/events` * returns array of events all future events * just look at output in Slack {"summary": "/bin/systemctl: Virtual Machines", "timeStart": "2018-10-22T22:00:00.000Z", "timeEnd": "2018-10-22T23:00:00.000Z", "location": "", "description": "" }, * Josh todo: Move the API notes here to their respective issues\\ === Meeting 6 [October 30th 2018]== * agenda * overview of current issues * plans for future of project ## Updates * Hao (spelling?) * not much progress * working on learning HTML and Flask * Stephen * not much, will have more QA work in ufture * Josh * frontend is ready to query for events and officers from backend * Brent * looking into current open issues * Ben * working on PR for Python readme * working en backend for events API ## Meeting * going over issues * Utilities to list * RPi * Arduino * Ice Cream * 3-D printing * no images (just names) * center listing * Home - Officers * Stephen will start template, Josh will clean up * Home - Events * Josh will take card design * Ben is working on Backend * future * mockups for project listing and services (from Ben) * services * make listing consistent instead of alternating * about page * who we are * what we do * link to constitution * relevant links * slack * github * other social media links * listing of previous officers * wiki page * change to external link to https://lug.cs.uic.edu/wiki/doku.php?id=start * Events page * same thing as events page in CS lounge * utilities - hardware based, and ice cream * services - online + hardware stuff * everything on utiities except ice cream * Josh: finish up mockup layout and create PR and issues * next meeting: next week Thursday (11/1) ===== Meeting 7 [November 1st 2018]===== Meeting notes # Agenda * Welcome Will Toher as new backend lead\\ * Go over current issues and PRs; check for updates\\ * Workshop # Meeting notes * merging services and utilities * front page: utilities -> services * Went over issues and PRs \\ ===== Meeting 8 [November 8th 2018]===== #Agenda\\ * updates from people\\ * go over current issues and pull requests in GitHub\\ * workshop rest of time\\ # Meeting Notes * Stephen, Ben, Hao - no updates\\ * Will, Josh - going through issues ===== Meeting 9 [November 13th 2018]===== # Agenda * updates from people * go over current issues and pull requests in GitHub\\ * Discuss refactoring of server file\\ * referencing https://github.com/BluuArc/multi-folder-flask-example\\ * workshop rest of time # Meeting Notes * Updates * Ben - historical officer stuff * Stephen - no updates * Jacob - service data * Teja - finishing up course * Josh - various issue * Discussed Integrating DnD Webapp with LUG website\\ # dndwebapp * SQL Lite for databases (until we move to Docker) * When using Docker, have a separate dedicated server for database managment *Postgres, MySQL ===== Meeting 10 [November 27th 2018]===== # Agenda * updates from people * go over current issues and pull requests in GitHub * workshop rest of time # Meeting Notes * Updates * Ben - no progress on projects backend, busy for next 2 weeks * Ghost - has prototype form ready, will talk to Ben on adding it to a server * error communication spec? * Jake - finishing up services page, minor image resizing issues * Josh - finished officer listing and officer policy * Stephen - no progress * Brent + Will - working on events PR * Teja - no updates * Deployment * option 1 - all hosted in house - current preference * option 2 - host static files (frontend) on GH, rely on LUG servers for data ===== Meeting 11 [December 4th 2018]===== # Agenda \\ * updates from people \\ * go over current issues and pull requests in GitHub\\ * discuss work TBD over break \\ * workshop rest of time (or work on projects/study for finals) \\ # Meeting Notes \\ * updates * Josh - looking over PRs * Ben, Will - busy with coursework * Teja - has basic layout * Jacob - working on PR * issues * Ben - working on projects API * future work * goal: deploy site before next semester starts * I don't expect any work being done during finals week * Keep in touch over Slack after finals Addendum to meeting notes: Minecraft will be added to service listing at a later date ===== Meeting 12 [TBD]=====