Skip to content

Instantly share code, notes, and snippets.

View MWins's full-sized avatar

Malcolm Winslett MWins

View GitHub Profile
@MWins
MWins / XML-PHP-form-from-file-and-save.md
Last active March 3, 2022 16:56
XML-PHP-form-from-file-and-save

Using XML/PHP to generate form, process and store results in XML

creating an MVP where a visitor can edit the information of an existing XML file by adding their name & contact info. I'd like to be able to save the altered xml to a new file and rename it to the visitor's name.

basically this as a starting point: http://stackoverflow.com/questions/12514000/edit-xml-via-html-form-php

Start

Ok this is pretty straight forward but without the existing xml file it's hard to help you. I'll just assume you have an empty xml file with name & contact. It'll look like this :

@MWins
MWins / CSS-Best Practices.md
Last active June 6, 2023 15:27
CSS best practices

What CSS best practices should I follow ?

HTML best practices Depends. How far down the rabbit hole do you want to go ?

Just need something to look good : use a frontend framework like foundation or bootstrap, won't learn much about CSS. Short list of Front End Frameworks

Surface level : work general to specific. Comment the sections of the CSS. Use a reset or normalizer. Work on patterns, use classes over IDs for reuse. CSS Resets - includes normalize.css Don't have links for the other parts. see below

Little bit deeper : Look into BEM or OOCSS. Those stand for Block Element Modifier and Object Oriented CSS. Two popular methodologies for CSS. Also SMACSS.

@MWins
MWins / git with wordpress-workflow.md
Last active January 25, 2017 02:12
git with wordpress-workflow

Using GIT with Wordpress - Workflow

Git is a source code control system. GitHub and BitBucket.org provide git support as part of their service. Github's free tier requires public repos. Bitbucket.org will let you create private repos on the free tier. You will need the git software along with an account at one of those providers to use these guide.

Details about starting with Source Code Control can be found in this gist : Source Control Start , this includes links to software and tutorials.

how does it help or what's the workflow...

First off, git should not be used as a backup tool. Media resources like images,videos,audio, etc, should not be placed into a git repo. Wordpress itself should not be part of a repo. Nor should it include any code which can be 'managed' via tools like composer.

@MWins
MWins / HTML-canvas-animation-js-libraries.md
Last active January 25, 2017 02:15
HTML Canvas Animation Tutorials and Javascript Libraries
@MWins
MWins / build-site-process.md
Last active January 25, 2017 02:22
build-site-process

From PSD of or other graphic source, is usually just make a folder and start work. Create a git repo (bitbucket or github). Use local webserver (WAMP or MAMP) to test.

ID the repeated sections, build those in order (header before footer). Haven't ever used a sitemap. Figure out the page archetypes depending on the project type. Article site has frontpage, category list, article page. Ecommerce add product page, checkout pages, user account page etc.

After the basic pages, figure out what additional patterns are to be supported for general page types. Articles have to support Lists (ul/ol), tables, images ... . Then any specialty items like pricing tables.

Write those out as partials so they can be included in different pages if necessary for testing.

If it's a personal project or not already laid out, it's do some basic mockups and then go through the above process. Course there's more involved in this type of deal since have to determine structure for the site based on the site objective.

@MWins
MWins / HTML5-Page-Structure.md
Last active January 25, 2017 02:23
HTML5-Page-Structure

Sectioning for HTML5 but it isn't implemented by browsers. The other option would be semantic HTML. But again, it isn't going to provide hard and fast rules for the entire document, it's more about how to tag specific sections.

With HTML5, the method is to use defined tags for each individual part of the page. An ARTICLE tag for the main content or focus of the page. Items which are tangential relevant to the ARTICLE either go into an ASIDE or a FIGURE. Otherwise use a DIV. SECTION should be mentioned but it's vague how they are to be used (see article below).

<HTML>
<body>
<header><h1> Site Name</h1></header>
<nav><a href="">About</a></nav>
<div>Ads go here</div>

Article Name

@MWins
MWins / web-security.md
Last active January 25, 2017 02:23
web-security

Basic stuff like SSL/TLS. How to set it up and make sure it's working properly.

The types of authentication available. How to secure passwords being sent over the internet. Types of encryption/hashing available and at least know which to use. How to let users reset passwords. Why plaintext passwords are bad.

Understanding cookies and sessions.

Basic permissions on *ix systems.

What steps to take to mitigate XSS/CSRF attacks.

@MWins
MWins / Workflow With Tools.md
Last active January 25, 2017 02:26
Workflow With Tools

Ok maybe I can help or at least try ...

The backend and frontend frameworks don't really intersect at the CMS. They intersect if and when a project is custom written. Let's say the backend uses Laravel PHP framework for the backend with MySQL database and the frontend uses Bootstrap/jQuery. Using those frameworks gives you a base level of code to start from which is much better than writing or rather rewriting what's considered 'universal' code. Universal code is a bad name for the code which almost all projects are going need. LIke for the frontend, forms will need to be styled and they should be styled so they are consistent across browsers/devices. Which I imagine you understand. Now the backend framework provides functionality like Routing requests from URLs to API calls, Database access (providing an abstraction layer to multiple database types through a common interface) and more. It does not include the structure of the database tables, nor does it provide the business logic specific to the applicatio

@MWins
MWins / Source-Code-Control-start.md
Last active January 25, 2017 02:26
Source-Code-Control-start

The most important tool for professional Web Developers and Designers

Git is the most important tool for professionals. It or some other type of Source Code Control.

Providers

Can use github for public projects and bitbucket offers private/public repos for single users/small groups.

GitHub - Free public repos

BitBucket - Free private/public repos up to 5 users.

@MWins
MWins / Web Development Tools.md
Last active January 25, 2017 02:26
Web Development Tools.

The mandatory one is GIT. It's too easy at the basic level to not use. Github offers free repos for public code. Bitbucket offers private or public repos for less than 5 users.

After that, it's about productivity. What type of jobs you plan on pursuing, etc.

Some useful tools which you should look into to see if they work for you :

SASS/LESS - CSS preprocessors. These are to help you organize your code, avoid repetition and basically augment CSS with some programmatic features.

Package managers : composer for PHP, npm for node.js, bower for general web. Helps keep code up to date and to manage large project's dependencies. There's others, see which works for you.