NU Marketing Website
View Project OnlineMy first major project with National University System.
With the build-out of the Marketing department, we the dev team (only 2 at project intake) were tasked to build out the new website in a 3 month period.
Previous version for reference from WaybackMachine.
The build requirements included the following:
- Convert all content from ColdFusion to WordPress database structure
- WordPress custom theme and custom plugins for custom functionality
- Recreate tools like the Program Finder and Locations listing
- SEO optimization
- Reduce website load time
Since the content of the ColdFusion version of the website had no database and was based on files in nested folders, I created a PHP crawler for the list of URLs we were provided. It crawled all the URLs and searched for specific div IDs or classes depending on templates, resulting in a rather large JSON object (over 3,000 pages worth of content).
Next, I converted the JSON payload to a PHP array which was the data input for loop which imported the data as multiple types of custom post types to a local machine WordPress database.
Initial (high-level) build plan:
- Create static versions of the templates (assigned to a contractor managed by myself and Director).
- Several front-end tools to build the theme dev like Gulp as a task runner, code linters through PHPCS, stylelint, ESLint, and assets compression (assigned to me). Concatenation was handled on the server level by WPVIP, our hosting provider.
- Create a custom theme from static templates (assigned to another dev).
- Build custom plugins for the back-end functionality and API integrations of RFI data handoff (assigned to me).
- Code review for QA (assigned to me).
The team decided to use React for the Program Finder, Locations listing, and live website search components to learn new tools and the WP JSON payloads lend themselves naturally to the build. All 3 are housed in a single custom WP plugin (site functionality, so should not be theme dependent). For optimization purposes, the assets needd for the Program Finder and Locations tools are only delivered on specific templates.
The build and maintenance have kept going and I have implemented webpack as well so that the team can use the latest levels of JS which can be used as an entry to React development and contributions to the React plugin that handles some of the tools on the website.
Successfully met the deadline and website requirements. This lead to our team handling new builds and conversions of other websites with similar processeses and same setup I developed. These projects included the CityU marketing website, Fundraising Academy, Harmony SEL website build, and the main NUS org website build.
I used these builds to teach our expanding team about industry code standards, clean code, and critical thinking to implement new technologies, client requests, or UX initiatives resulting from brainstorming sessions.