LouWii's Blog

< Web developer & geek stuff />

Category: Dev (page 2 of 7)

Extend Django User Model

Django CMS has its own User model but you might need to add attributes and other properties to it (like an avatar, right ?). The easiest way to do that is to extend that model with another model (we’ll call it UserProfile) and link them together using a one-to-one relationship.

Creating the UserProfile model

Nothing special here, I’m sure you know how it works.

Creating a UserProfile when creating a User

Each User needs to have a UserProfile object. To make sure that applies to every user, we’ll create a UserProfile each time a User is created. To do that. we’ll use the post_save signal (signals doc).

Just under the UserProfile code, you can add that code

And you’re pretty much good to go. You can access the user’s UserProfile using user.user_profile.

Find Application Support Directory in Swift (OSX, iOS)

It’s quite easy actually, once you know the answer…

 

Django REST Framework : add an attribute on the fly in a Serializer

Seralizers from DRF are doing a very good job at converting any Model to JSON data. They are even more awesome when you know how to add custom attributes to them.

In my case, I needed to add an attribute based on the current logged in user and related data from my model. To do that, I used a SerializerMethodField.

From the doc :

This is a read-only field. It gets its value by calling a method on the serializer class it is attached to. It can be used to add any sort of data to the serialized representation of your object.

And the example :

Here’s a preview of how I implemented it :

Basically, this sets a field to True or False if the current user is ‘liking’ the Post object.

This is a pretty neat feature that I don’t want to forget about, so that’s why I’m writing it down here.

Django : resize an image on upload

This is a typical use-case : your site/app allows users to upload a picture. But you don’t want to store full size 8Mb picture, and still, it’s comfortable for the user to not have to manually resize the image before uploading it. The solution : resizing the image “on the fly” when receiving it on the server side.

Another use-case, also quite common : you need to generate a thumbnail for the uploaded picture. The following code will help you too.

This script is re-sizing the image only if it’s a new PicturePost (we check that the object key isn’t set).

We’re doing some calculation to get the right ratio before re-sizing the image. We can’t use the thumbnail() method because we want to resize based only on the width of the image. The thumbnail() method will resize the image based on the biggest between width and height.

We convert the image to jpeg with a 90 quality (the default is 75, 100 meaning no jpeg compression at all).

We also keep the exif information if its exists. By default, it’ll disappear, so we have to manually add them again when saving the resized file.

Once it’s resized, we save the object into the database.

You can also use the same logic to create a thumbnail of the image and store it into another ImageField field. 😉

Quick Start with Foundation

Never re-invent the wheel ! That’s a good moto for any developer out there. Let me show you how to quickly bootstrap you website stylesheet with Foundation. Its default components will help you to define a generic style very easily so you can concentrate on customizing to match your pixel-perfect design.

Setup Foundation on you machine

Install the foundation command line using npm

Creation of a new project

Setup your project with “foundation new” command.

You’ll have to choose between different options. I just choose the most common one, use Foundation for site with a simple template.

At the end, just type

Each time you’ll modify a SASS file, it’ll be compiled (and rather quickly !) into an app.css file.

All you main SASS code has too be written in app.scss file.

You have the choice to include all foundation, or just a few part of it. Or even nothing at all. But I recommend at least one :

Which is taking care of resetting all styles, setting default styling for HTML elements and so on.

Write your code without annoying default Foundation classes

The goal is to use our own classes with Foundation code. Here is a simple example :

For each of its components, Foundation gives you access to several mixins that you can include everywhere.

Anatomy of a good ExpressionEngine add-on

ExpressionEngine 3 has brought a lot of changes and if you’re coming from EE2, you might miss some that are really interesting. Ellislab team has a done a good job of bringing APIs and services for third party developers to use in their add-ons. Your code will be cleaner than ever 🙂

Here is just a selection of things that are used in almost every add-ons, the ones that you should really use in your next project.

Use Models

Documentation

Messing around with SQL queries might be ok, but if you add-on is quite complex and modify EE data, you might want to switch to using models. Models help you handling EE data (channel, members…) but you can also create your own ones. You’ll just rely on EE code and APIs, it’s way safer and will facilitate maintaining your code.

Plus it totally makes sense to use that service when doing OOP. It’s way easier to get back Objects and play with them, than getting back SQL results and process them before doing anything relevant.

Use shared form view

Documentation

Creating forms can be long and complex. But with the shared form view, it’s so easy you’ll even enjoy it. You basically need to declare your form using arrays. A lot of different field types are available. EE will generate all the HTML for you. Honestly, dealing with add-on settings is no more a pain now.

Use validation service

Documentation

Now it’s time to validate the user inputs. Again, no more pain, just use the validation service. It contains pre-defined rules and you can also create custom ones. Easy to write, easy to maintain, and a nice beautiful code. 😀

Add internal documentation

Documentation

This is not a code tip, but EE now includes internal doc. If you add a README.md file inside your add-on folder, you’ll be able to access that file from within EE. It might not be useful to you, but it’ll surely be for other developers out there that will need your add-on doc. 😉

Check the other services

ExpressionEngine 3 is providing other services that you might want to use, check them out.

EE3 architecture is working with dependencies, prefixes and providers.

There’s even a tree data structure if you ever need one.

Older posts Newer posts

© 2018 LouWii's Blog

Theme by Anders NorenUp ↑